在彈出框中提交表單數據並在彈出框中顯示結果

Question

我需要在彈出框中實現搜索表單，並在彈出框中顯示搜索結果。

我已經實現了一個彈出框與我的搜索輸入字段，並提交按鈕，但不知道如何檢索數據與提交表單後彈出框。

我有一些疑問像如下： -

1. 我怎麼能在彈出框，會是怎樣的形式中獲取數據的操作中檢索數據。

2. 如何在彈出框中顯示結果。

感謝

Answer 1

如果你在尋找什麼，因爲我不知道。但它應該給你一個想法，然後適應你的需要。對不起，沒有更詳細地解釋所有這些，我只是看到帖子，所以我想在回去工作之前給你一個想法。

表單代碼：

<form method="" action=""> 
<h2>Name</h2><br /> 
    <input name="name" type="text" size="55" class="required error name"><br /> 
    <h2>Email </h2><br /> 
    </span><input name="email" type="text" size="55" class="required email"/><br /> 
    <h2>Phone</h2><br /> 
    <input name="phone" type="text" size="55" class="phone" /> <br /> 
    <h2>Comments</h2><br /> 
    <textarea name="comments" rows="15" cols="47" class="comments"></textarea><br /> 
    <br /> 
<input type="submit" value="Submit" class="submitBtn" /> 
</form> 

Ajax代碼：

$(document).ready(function(){ 
$('.submitBtn').click(function(e){ 
    e.preventDefault(); 
    var name = $('.name').val(); 
    var email = $('.email').val(); 
    var phone = $('.phone').val(); 
    var comments = $('.comments').val(); 

    var dataObject = { 
     name: name, 
     email: email, 
     phone: phone, 
     comments: comments 
    } 

    $.Ajax({ 
    url: php/sendmail.php, 
    type: 'post', 
    dataType: "json", 
    contentType: "application/json", 
    data: dataObject, 
    success: function(data){ 
      var createdDiv = '<div class="DIVCENT"><p class="dataText">' + data + '</p></div>'; 
      $('body').append(createdDiv); 
     }; 
    }); 
}); 

}); 

如果要居中的DIV。你需要一些像下面這樣的CSS。

.DIVCENT{ 
height: 100px; 
width:40%; 
margin:auto; 
}