CODEWITHSUNDEEP
jqueryajaxserialization
user1066679
user1066679

Reputation: 95

Jquery form serialize issue

I have a form

<form method="post">

<input type="text" name="name" /><br />
<input type="text" name="test1" /><br />
<input type="text" name="test2" /><br />
<input type="text" name="test3" /><br />
<input type="text" name="test4" /><br />
<input type="text" name="test5" /><br />
<input type="text" name="test6" /><br />
<input type="submit" name="submit" /><br /></form>

And i wrote a jquery ajax script like this

$(":input[ name= 'submit']").click(function(){

    var values = $("form").serialize();

    $.ajax({
        url:"test.php",
        type:"post",
        dataType:"json",
        data: {
            method: "test",
            data: values
        },
        success: function(){
            alert("success");
        },
        error:function(){
            alert("failure");
        }   
    }); 
    return false;   
});

data: { method: "test", data: values }

But when i pass two parameters in ajax.data element, i cannot access it as $_POST['name'] or $_POST['test1'] at server side. But it is possible if i add only one parameter to the ajax.data element.

Please get me a solution

Upvotes: 0

Views: 15639

Answers (2)

Nicola Peluchetti
Nicola Peluchetti

Reputation: 76870

You should do

   data: values,

in this way you can get your data $_POST['test1'];

if you need to send extra data use hidden fields

EDIT if you use two fields like in your exampel you will have the data in $_POST['data'] (here you will have the serialized form) and $_POST['method']

EDIT 2 actually $_POST['data'] is a string (name=abc&test1=&test2=&test3=&test4=&test5=&test6= ) because a string is set to the server, if you access $_POST['data']['name'], this returns n because in php you can access string as arrays, in your case you are not passing a valid index and it returns the first characther

$name = "aghjsghjgj";
echo $name['name'];//this echoes the first letter as name is not a valid index

echo $name[2];//this echoies the third letter , h

http://codepad.org/ferFnrKW

Upvotes: 1

Darin Dimitrov
Darin Dimitrov

Reputation: 1038710

The .serialize method already converts the form values into key/value pairs that must be sent as-is to the server. If you want to pass additional values you could use a hidden field in the form.

Like this:

<form method="post">
    <input type="hidden" id="method" name="method" value="test" />

    <input type="text" name="name" /><br />
    <input type="text" name="test1" /><br />
    <input type="text" name="test2" /><br />
    <input type="text" name="test3" /><br />
    <input type="text" name="test4" /><br />
    <input type="text" name="test5" /><br />
    <input type="text" name="test6" /><br />

    <input type="submit" name="submit" /><br />
</form>

and then:

$('form').submit(function() {
    var values = $(this).serialize();
    $.ajax({
        url: "test.php",
        type: "post",
        dataType: "json",
        data: values,
        success: function(){
            alert("success");
        },
        error:function(){
            alert("failure");
        }   
    }); 
    return false;   
});

and if you need to set some other value just before sending the AJAX request:

$('#method').val('some other value');

Also notice that I subscribed to the .submit event of the form instead of the click event of the submit button which will also properly handle the case when the user presses the Enter key while inside some of the input elements, whereas your code won't be triggered because the submit button was never clicked and yet the form was submitted.

Upvotes: 2

Related Questions