Skip to content Skip to sidebar Skip to footer

Jquery/ajax Form Post Data Is Not Working

I'm not expert with Jquery. I've built a 4 steps html form like

Solution 1:

You just need to do event.preventDefault() in the top of your event listener:

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

})

Solution 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 script

<?phpif(isset($_POST['action'])){
        post_things($_POST);
        returntrue;
    }
    functionpost_things($request){
        echo"<pre>";
        print_r($request);
        echo"</pre>";
    } 
?>

Solution 3:

The reason you get redirected is because you are submitting the form.

Since in your <form id="msform" enctype="multipart/form-data"> you define no action it is submitted to itself.

You must prevent form from submitting using preventDefault().

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

Post a Comment for "Jquery/ajax Form Post Data Is Not Working"