jquery form submission

Question

Может ли кто-нибудь показать мне учебник по использованию jQuery, чтобы отобразить успешную отправку формы без обновления страницы. Что-то подобное происходит в gmail, когда сообщение доставлено, и желтое наложение, которое показывает, что вы доставляете сообщение, а затем исчезаете.

Answer 1

Использование jQuery + JSON сочетание что-то вроде этого:

test.php:

<script type="text/javascript" src="jquery-1.4.2.js"></script> 
<script type="text/javascript" src="jsFile.js"></script> 

<form action='_test.php' method='post' class='ajaxform'> 
<input type='text' name='txt' value='Test Text'> 
<input type='submit' value='submit'> 
</form> 

<div id='testDiv'></div> 

_test.php:

<?php 
     // Code here to deal with your form submitted data. 
     $arr = array('testDiv' => 'Form is successfully submitted.'); 
     echo json_encode($arr); 
?> 

jsFile.js:

jQuery(document).ready(function(){ 

    jQuery('.ajaxform').submit(function() { 

     $.ajax({ 
      url  : $(this).attr('action'), 
      type : $(this).attr('method'), 
      dataType: 'json', 
      data : $(this).serialize(), 
      success : function(data) { 
         for(var id in data) { 
          jQuery('#' + id).html(data[id]); 
         } 
         } 
     }); 

     return false; 
    }); 

}); 

---

ИЛИ:

Вы можете использовать jQuery Form Plugin