hellomello
hellomello

Reputation: 8585

passing serialized jquery data to php, what am i doing wrong?

I currently have a form with inputs and name attributes.

I'm able to get what I needed through jquery:

 var inputValues= $('.myForm').serialize();

if I alert(inputValues), I get what I needed, (like form GET variables: categories=examplevalue&name=examplename&email=exampleemail)

Now, I'm trying to pass it to PHP with ajax, like so (ajax.js)

            $.ajax({
                url: "myfile.php",
                type: "POST",
                data: "inputs="+inputValues
            }).done(function(data){
                alert(data);
            });

In my PHP i have this:

if(isset($_POST['inputs'])){
   echo $_POST['inputs'];
}

I assume that it would alert out bunch of variables depending on my form, but it only echo's out the first name variable which is categories

What am i doing wrong here?

Thanks

Upvotes: 0

Views: 4560

Answers (5)

Hailwood
Hailwood

Reputation: 92581

Check this out: http://jquery.webspirited.com/2011/02/jquery-serializepost/

Sorry about formatting I will fix when on computer

 (function($) {

        $.fn.serializePost = function() {

var data = {};

var formData = this.serializeArray();

for (var i = formData.length; i--;) {

var name = formData[i].name;

var value = formData[i].value;

var index = name.indexOf('[]');

if (index > -1) {

name = name.substring(0, index);

if (!(name in data)) {

data[name] = [];

}

data[name].push(value);

}

else

data[name] = value;

}

return data;

};

})(jQuery);

Upvotes: 1

d_inevitable
d_inevitable

Reputation: 4451

Two things:

  1. assignment of data:

    $.ajax({
            url: "myfile.php",
            type: "POST",
            data:  $('.myForm').serialize()
    
    }).done(function(data){
            alert(data);
    });
    

    Prefix field names with with inputs. Like <input name="x"/> becomes <input name="inputs[x]"/>.

  2. Displaying arrays in php:

    if(isset($_POST['inputs'])){
       var_dump($_POST['inputs']);
    } 
    

    (echo would just print Array when its not a scalar value).

Update

IF, Lior Cohen is right and your server does not recognise the field name notation (not the case with default php settings) then you can use this simple workaround:

parse_str(file_get_contents("php://input"), $POST);

and then use $POST instead of $_POST. Be aware though that $POST won't be super-global.

Upvotes: 3

Hamidreza
Hamidreza

Reputation: 1915

I do not tested this code but i think it works

    var inputValues= $('.myForm').serialize();
    $.ajax({
        url: "myfile.php",
        type: "POST",
        data: inputValues,
        success: function(data){
            alert(data);
            // or use: console.log(data); /*you need firebug to log*/
        }
    });

// and php

if(isset($_POST)){
   var_dump($_POST);
}

Upvotes: 0

Lior Cohen
Lior Cohen

Reputation: 9055

serialize() generates a query string (foo=bar&baz=yikes) format that cannot be assigned to a single parameter (inputs=... in your case).

In your $.ajax call, remove inputs= and just use inputValues alone. This would allow you to get the individual variables in your form using $_POST['myvar'].

Upvotes: 2

John Green
John Green

Reputation: 13435

Just look at what you're sending to the PHP... if you concatenate 'inputvalues=' with the serialzied form, you wind up sending the following to the PHP:

inputs=categories=examplevalue&name=examplename&email=exampleemail

So, yeah... it is going to be confused. : )

Instead, just do this in the jQuery:

data:inputValues

You'll need to change your acceptance conditions on the post.

You can also serialize your data into JSON and deserialize it, but this should get you started.

Upvotes: 0

Related Questions