JQuery/Ajax form Почтовые данные не работают

Question

Я не эксперт в JQuery/AJAX, я просто «любитель», и я стараюсь учиться на примерах и учебниках, поэтому, пожалуйста, будьте всеобъемлющими. Я построил 4 шага HTML форму, как

<form id="msform" enctype="multipart/form-data"> 
    <fieldset id="publish1" data-check-id="1"> 
     //some inputs 
    </fieldset> 
    <fieldset id="publish2" data-check-id="2"> 
     //some inputs 
    </fieldset> 
    <fieldset id="publish3" data-check-id="3"> 
     //some inputs 
    </fieldset> 
    <fieldset id="publish4" data-check-id="4"> 
     <input type="submit" class="submit action-button pull-right top-35" value="Publish"/> 
    </fieldset> 
</form> 

и после написания некоторых проверок Jquery в моем файле .js, я пытался передать свои данные в файл PHP через AJAX. Моя formData функции выглядит следующим образом:

<script> 
    function formData() { 
     var serializedValues = jQuery("#msform").serialize(); 
     var form_data = { 
      action: 'ajax_data', 
      type: 'post', 
      data: serializedValues, 
     }; 
     jQuery.post('mypath/insert.php', form_data); //where data should be sent 
     return true; 
    } 
</script> 

Поиск вокруг Я пытался создать файл PHP получает данные с этой структурой:

<?php 
if (isset($_POST['data'])) { 
    post_things(); 
    return true; 
} 

function post_things() { 
    $title = trim($_POST['form_title']); 
    // where form_title is the input[name] of what I want get, serialised into jquery serializedValues variable 
    //other similar inputs 
    //do something with $title and other $variables 
} 
?> 

Я инициализируется проверки и AJAX функция делает что-то, как следующее :

<script> 
    $(document).ready(function() { 
     msform_init(); //this validate form step by step (it's working!) 
     $('#msform').submit(function (event) { 
      if (form_completeCheck() && true) { //This check if something empty 
       formData(); 
       if (formData() && true) { 
        window.location.replace("//some redirection to success"); 
       } else { 
        window.location.replace("//some redirection to failure"); 
       } 
      } else { 
       event.preventDefault(); 
      } 
     }) 
    }) 
</script> 

проблема заключается в том, что, когда я нажимаю на представить я был перенаправлен на страницу, где URL является mypath? ALL_MY_DATA_SERIALISED. Где моя ошибка? Я не вижу этого из-за моего невежества. Является ли функция jquery/ajax, в файле php или в моем html? Заранее благодарю вас за помощь.

Answer 1

Вам просто нужно сделать event.preventDefault() в верхней части слушателя событий:

$('#msform').submit(function(event){ 
    event.preventDefault();   
    if(form_completeCheck() && true){ //This check if something empty 
    formData(); 
    if(formData() && true){ 
     window.location.replace("//some redirection to success"); 
    } else { 
     window.location.replace("//some redirection to failure"); 
    } 
    } 

}) 

Answer 2

HTML Script

<form id="msform" enctype="multipart/form-data"> 
    <input type="hidden" name="action" value="do_action"/> 
    <fieldset id="publish1" data-check-id="1"> 
    //some inputs 
    </fieldset> 
    <fieldset id="publish2" data-check-id="2"> 
    //some inputs 
    </fieldset> 
    <fieldset id="publish3" data-check-id="3"> 
    //some inputs 
    </fieldset> 
    <fieldset id="publish4" data-check-id="4"> 
    <input type="button" id="do_action" class="submit action-button pull-right top-35" value="Publish"/> 
    </fieldset> 
</form> 

JavaScript

$("#do_action").click(function(){ 
    $.ajax({ 
     type:'POST', 
     data:$("#msform").serialize(); 
     url:'<<php script url>>', 
     success:function(data){ 
      alert(data); 
     } 
    }); 
}); 

PHP скрипт

<?php 
    if(isset($_POST['action'])){ 
     post_things($_POST); 
     return true; 
    } 
    function post_things($request){ 
     echo "<pre>"; 
     print_r($request); 
     echo "</pre>"; 
    } 
?> 

Answer 3

Причина вы попадаете в том, что вы отправляете форму.

С вашего <form id="msform" enctype="multipart/form-data"> вы не определяете никаких действий, которые он представляет себе.

Вы должны запретить отправку формы с помощью функции preventDefault().

$('#msform').submit(function(event){ 
    event.preventDefault(); //Add this line 
    ..............