Form data to PHP through AJAX

Question

Used this script many times to pass 1 or 2 values to a PHP file, works fantastic. Using it now to pass 7 values and only the first 2 get through.

$(document).ready(function(){
$("form#send_note").submit(function() {
var to_user = $('#to_user').attr('value');
var from_user = $('#from_user').attr('value');
var defaultpic_from  = $('#defaultpic_from').attr('value');
var defaultpic_to = $('#defaultpic_to').attr('value');
var your_username = $('#your_username').attr('value');
var message_title = $('#message_title').attr('value');
var message_contents = $('#message_contents').attr('value');
    $.ajax({
        type: "POST",
        url: "../inbox/send_note.php",
        data: "to_user="+ to_user +"&amp; from_user="+ from_user + "&amp; defaultpic_from="+ defaultpic_from + "&amp; defaultpic_to="+ defaultpic_to + "&amp; your_username="+ your_username + "&amp; message_title="+ message_title + "&amp; message_contents=" + message_contents,
        success: function(){
            $('form#send_note').hide(function(){$('div.success2').fadeIn();});

        }
    });
return false;
});
});

I have double checked all of the names, all is in order it's just the values after from_user (defaultpic_from) and so on won't go through. I believe it's the way I have the "data:" listed. I am a complete newbie when it comes to javascript so any advice on the properway to get these through would be fantastic!

thescientist · Accepted Answer · 2012-01-27 01:44:26Z

1

1) you know with jquery you can just do this, right?

var defaultpic_from  = $('#defaultpic_from').val();

2) also, you don't need to turn the & into an entity, but as mentioned, you should be using encodeURIComponent in the values

3) have you verified all the variables actually have values before the ajax request gets made? what happens when you look in POST? Are you getting the members in POST, but no values? or no keys and no values?

4) Try using Chrome's Network tab in the developers tools to examine the request and response

here is an example I am using now, where params is nvp string and sync is true

var callService = function(sync, params, successCB, errorCB){
  console.log('ENTER callService');
  $.ajax({
    type      : 'POST',
    url       : 'required/core/Service.php',
    async     :  sync,
    data      :  params,
    dataType  :  'json',
    success   :  function(data){
      console.log('ENTER POST SUCCESS');
      successCB(data);
    },
    error     :  function(){
      console.log('ENTER POST ERROR');
      errorCB();
    }
  });
};

what would be really helpful if you could go into the request and response headers and show them to us. you could have PHP echo

echo json_encode($_POST);

to make it easier to get the response

edited Jan 27, 2012 at 1:44

answered Jan 27, 2012 at 1:32

thescientist

2,9581 gold badge21 silver badges15 bronze badges

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

6 Comments

user1053263 Over a year ago

Unfortunatley I know very little of javascript, just a very basic understanding of it. I passed the values through the php without jquery and it echoed through correctly. I'm going to play around with this encodeURIComponent function and see what I can do. Thank you so much for responding!

thescientist Over a year ago

and by respoonse, I mean easier to debug say in Chrome's network tab

user1053263 Over a year ago

I've had chrome for some time and never took notice to the network tab. This makes life easier. Thank you sir. Well the data is getting sent. Also when i by pass ajax and go right into the php file, the values go through fine.

thescientist Over a year ago

when you say go right to the page, you mean using the url and query string in the browser? That wouldn't work if you are using $_POST. Are you using REQUEST?

thescientist Over a year ago

also, suggested echo out just POST to confirm that everything is being correctly received by PHP, unless that is what you mean by the data getting sent

|

Kai Qing · Accepted Answer · 2012-01-27 01:37:51Z

0

I bet the value of your default pic is terminating the query string. You can wrap your vars like this to ensure they are properly escaped:

$(document).ready(function(){
    $("form#send_note").submit(function() {
    var to_user = encodeURIComponent($('#to_user').attr('value'));
    var from_user = encodeURIComponent($('#from_user').attr('value'));
    var defaultpic_from  = encodeURIComponent($('#defaultpic_from').attr('value'));
    var defaultpic_to = encodeURIComponent($('#defaultpic_to').attr('value'));
    var your_username = encodeURIComponent($('#your_username').attr('value'));
    var message_title = encodeURIComponent($('#message_title').attr('value'));
    var message_contents = encodeURIComponent($('#message_contents').attr('value'));
        $.ajax({
            type: "POST",
            url: "../inbox/send_note.php",
            data: {to_user:to_user, from_user:from_user, defaultpic_from: defaultpic_from, defaultpic_to:defaultpic_to, your_username:your_username, message_title:message_title, message_contents:message_contents},
            success: function(){
                $('form#send_note').hide(function(){$('div.success2').fadeIn();});

            }
        });
    return false;
    });
    });

You will need to urldecode the post vars in php but that should do it.

edited Jan 27, 2012 at 1:37

answered Jan 27, 2012 at 1:28

Kai Qing

18.9k6 gold badges41 silver badges61 bronze badges

8 Comments

Kai Qing Over a year ago

also, the scientist is right about .val(). While your method will work, it is more proper to the library to use the intended function. And if this still fails, try changing all those & to just & with no white space between vars.

user1053263 Over a year ago

DARN same thing. in my PHP file i have the _POST variable going through this function, should I remove it or add a different function now that we added the urldecode? $to_user = htmlspecialchars(trim($_POST['to_user']));

Kai Qing Over a year ago

try checking the answer again. I changed it to use object type post vars instead of query string. This method lets jquery compose the query string itself.

user1053263 Over a year ago

SOO close, it's going through it just has the %20 between each space. But it's working! I'm going to see if I can explode it with php and dump those!

Kai Qing Over a year ago

don't explode. $to_user = htmlspecialchars(trim(urldecode($_POST['to_user'])));

|

Collectives™ on Stack Overflow

Form data to PHP through AJAX

2 Answers 2

6 Comments

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related