Using jQuery .serialize() within ajax array to pass the PHP $_POST as Variables?

Question

This is the jQuery code i'm using to send the form details to a php function:

jQuery(document).ready(function($) {    
    jQuery('.submit').click(function(){
        var str = $("#ajaxForms").serialize();
        var data = {
            action: 'myajax-submit',
            serialize: str,
            beforeSend: function(){
                alert('Sending...');
            }
        };  
        jQuery.post(MyAjax.ajaxurl, data,  function(response) {
            alert('Got this from the server: ' + response);
        });
        return false;   
    });
});

and this is the php function:

function myajax_submit() {
    $whatever = $_POST['serialize'];
    echo $whatever;
    die(); 
}

Everything works, but when the alert box appears the text displays a string of values from my html form #ajaxForms. I believe this is because the php function echos the $_POST['serialize'].

In my form i have an input box such as:

<input id="postID" name="postID" value="First Name" type="text" />

but when i try echo the $_POST['postID'] variable in the php it doesn't display anything in the alert box.

I thought by sending the form data serialized to the php function i could use the $_POST variable associated with the form inputs?

Help appreciated. :)

I don't know PHP but wouldn't your postID be a member of the serialize object you passed as data. — K. Bob
– K. Bob, Commented Jan 18, 2012 at 21:30

mobius · Accepted Answer · 2012-01-18 22:06:43Z

11

By serializing the form inputs with jQuery's serialize you create a string like:

a=1&b=2&c=3&d=4&e=5&postID=10

In order to get the postId you need to de-serialize the $_POST['serialize']. In order to do so you should do something like:

parse_str($_POST['serialize'], $whatever);

Now on $whatever['postID'] is what you are searching for.

Edit: Fixing parse_str() :)

edited Jan 18, 2012 at 22:06

answered Jan 18, 2012 at 21:29

mobius

5,1742 gold badges30 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Shoebox Over a year ago

Thanks for the reply, I tried the following but there is no result: function myajax_submit() { $whatever = parse_str($_POST['serialize']); echo $whatever['postID']; die(); }

mobius Over a year ago

@MattStrange Do an echo $_POST['serialize']; What are you getting?

Shoebox Over a year ago

Just the echo in the function i get a string from the form, postID=First+Name&GreetingAll=Hello+Everyone!

mobius Over a year ago

@MattStrange Ah, sorry my bad. I wrote parse_str incorrectly. Please see the edit

Shoebox Over a year ago

Thanks mobius, your the man! seems to be all in working order :)

|

Rob W · Accepted Answer · 2012-01-18 21:31:16Z

7

You're implementing $.post in a wrong way. .serialize() returns a string. So, when you pass serialize: str to $.post(), the form itself is not added any more, but a plain string containing the serialized form.

The code below is correct, using $.ajax (see the commented lines).

jQuery('.submit').click(function(){
    var str = $("#ajaxForms").serialize();
    // If you realllly. want a parameter serialize, uncomment the following line
    // str += '&serialize=' + encodeURIComponent(str);
    str += '&action=myajax-submit';
    jQuery.ajax(MyAjax.ajaxurl, {
        method: 'POST',
        data: str,
        success: function(response) {
            alert('Got this from the server: ' + response);
        },
        beforeSend: function(){
            alert('Sending...');
        }
    });
    return false;   
});

answered Jan 18, 2012 at 21:31

Rob W

350k87 gold badges811 silver badges683 bronze badges

2 Comments

Shoebox Over a year ago

Hey Rob, I tried the following code but receive an empty result for that i don't know why, i removed the method: 'POST' to as wordpress handles the jQuery differently. I'm following this guide, codex.wordpress.org/AJAX_in_Plugins

Rob W Over a year ago

Use my code, literally. You can use jQuery.post, if you want, but beforeSend will not work. See this code: pastebin.com/4DVQih3i

Collectives™ on Stack Overflow

Using jQuery .serialize() within ajax array to pass the PHP $_POST as Variables?

2 Answers 2

6 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related