2010-04-27 7 views
1

J'essaie de soumettre un formulaire via AJAX au lieu d'utiliser la soumission POST normale. Le code HTML est juste une forme standard avec method="post" et mon code jQuery est la suivante:La soumission de formulaire jQuery AJAX ne fonctionne pas

jQuery.noConflict(); 
jQuery(document).ready(function($) { 
    var $form = $('#default_contact'); 

    $form.submit(function() { 
     $.ajax({ 
      type: 'POST', 
      url: $form.attr('action'), 
      data: $form.serialize(), 
      success: function(response) { 
       console.log(response); 
      } 
     }); 

     return false; 
    }); 
}); 

(Basé sur this answer)

Je retourne faux de la fonction d'envoi, mais la forme est encore en train soumis et je ne peux pas comprendre pourquoi. Ne pas avoir d'erreurs Firebug.

Répondre

4

votre code fonctionne bien si HTML est bon de configuration. voici mon test html (avec php), donc vous pouvez comparer avec le vôtre.

<?php 
if (!empty($_POST)) { 
    die("<pre>" . print_r($_POST, true) . "</pre>"); 
} 
?> 
<html> 
<head> 
    <title>ajax submit test</title> 
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 
    jQuery.noConflict(); 
    jQuery(document).ready(function ($) { 
     var $form = $('#default_contact'); 

     $form.submit(function() { 
      $.ajax({ 
       type: 'POST', 
       url: $form.attr('action'), 
       data: $form.serialize(), 
       success: function (response) { 
        alert(response); 
       } 
      }); 

      return false; 
     }); 
    }); 
</script>  
</head> 
<body> 
    <form id="default_contact" action="formsubmit.php" method="post"> 
    <input type="hidden" value="123" name="in1" /> 
    <input type="hidden" value="456" name="in2" /> 
    <input type="submit" value="send" /> 
    </form> 
</body> 
</html> 
+0

Il s'est avéré être quelque chose de vraiment stupide - le code de la bibliothèque jQuery n'était pas inclus. C'était dans un PHP conditionnel qui était faux sur la page que je testais avec ... D'oh! – DisgruntledGoat

2

Si vous avez votre code html mis en place afin que la forme fonctionne tout seul, il agira comme une forme normale sans jquery. Alors, prenez l'attribut d'action du html, et changer votre jquery à:

url: your-submit-file.php, 

Si cela ne fonctionne pas, essayez:

jQuery(document).ready(function($) { 
    var $form = $('#default_contact'); 

    $form.submit(function(event) { 
     $.ajax({ 
      type: 'POST', 
      url: your-submit-file.php, 
      data: $form.serialize(), 
      success: function(response) { 
       console.log(response); 
      } 
    }); 
    event.preventDefault; 
    return false; 
}); 

Aussi, avez-vous essayé jQuery de .post $() ? Il est beaucoup plus facile à utiliser ...

0

i avait un même mon problème de problèmes était que pendant un poste de forme, j'utilisais $ (le « formulaire »). Soumettre à faire quelque chose avant que la page présentée. ce quelque chose comprenait une action jquery post. unfortunatley, l'action post wouldnt complète avant que le poste de formulaire dûment rempli, et donc causé des problèmes tard- mon code ressemblait à ceci:

 $("form").submit(function() { 
       var result = 
        $.post('/Controller/Action', 
        { data: array.toString() } 
      }); 

La solution était de

 event.preventDefault; 

immédiatement avant le retour vrai, qui arrête l'envoi du formulaire jusqu'à la fin de l'appel ajax.

Questions connexes