CODEWITHSUNDEEP
phpjqueryajax
j-p
j-p

Reputation: 3818

PHP, Jquery ajax not passing form as recognizable $_POST

jQuery doesn't seem to be passing form variables or the http POST action when using the .ajax()

Doing a var_dump( $_POST ); results in an empty array.

Suggestions? What have I done wrong.... it's a simple concept - Someone esle posted a similar Q, but no one responded, his solution was adding an id to the form, mine already has that, so it's not fixing my issue.

currently I'm viewing the return page contents in firebug - I'm not doing anything yet, because I can't get the data to the server...(first things first).

My HTML

<script type="text/javascript">
$( document ).ready( function(){
    $( "#myform" ).submit( function () {
        $.ajax({
            type: "POST",
            dataType: "html",
            cache: false,
            url: "x.php",
            success: function( data ){              
                //...tell user there was success...
            },
            error: function( data ){
                //...tell user thre was a problem...
            }
        });
        return false;
    });     
});
</script>

<form name="myform" id="myform" action="" method="POST">
    <label for="name" id="name_label">x: </label>
    <input type="text" name="x" id="x" size="30" value=""/> 
    <input type="submit" name="submit" value="Submit"> 
</form>
<div id="results"><div>

And here is the (x.php) PHP code - very simple proof of concept...

<?php
var_dump( $_GET );
var_dump( $_POST );
var_dump( $_REQUEST );
?>

the response looks like this

array(0) {}
array(0) {}
array(1) {
  ["PHPSESSID"]=>
  string(26) "e1j18j..."
}

Upvotes: 0

Views: 497

Answers (3)

Musa
Musa

Reputation: 97672

You didn't pass any post data in the ajax call, try

    $.ajax({
        type: "POST",
        dataType: "html",
        cache: false,
        url: "x.php",
        data: $(this).serialize(),
        success: function( data ){              
            //...tell user there was success...
        },
        error: function( data ){
            //...tell user thre was a problem...
        }
    });

Upvotes: 5

Roger
Roger

Reputation: 1693

You can do it like this

$(document).ready(function(){
   $( "#myform" ).submit( function () {
       $.ajax({
         type:'POST',
         data:'xname='+$("#x").val(),
         url:'SOMETHING.php',
         success:function(data){
           //Do something with the returned data
         }
       });
   });
});

And in the php file

echo $_POSST['xname'];

Hope this helps

Upvotes: 0

Blender
Blender

Reputation: 298106

You need to serialize the form:

    $.ajax({
        type: "POST",
        data: $(this).serialize(),
        cache: false,
        url: "x.php",
        success: function( data ){              
            //...tell user there was success...
        },
        error: function( data ){
            //...tell user thre was a problem...
        }
    });

Without data, you aren't sending anything with your POST request.

Upvotes: 1

Related Questions