Submitting From jQuery to PHP

Question

I have sent data to my jquery file and I tested the data string and everything is stored where it should be but when I post it to my php file all the variables are null. Can someone help me?

$(document).ready(function() {
  $(".button").click(function() {
  //$('.error').hide();
  var firstname = $("input#First_Name").val(); 
  var lastname = $("input#Last").val(); 
  var areacode = $("input#area_code").val(); 
  var phonenumber = $("input#Phone_Number").val(); 
  var emailaddress = $("input#emailaddress").val(); 
  var confirmemail = $("input#confirm_email").val(); 
  var password = $("input#Password_Input").val(); 
  var confirmpassword = $("input#ConfirmPassword").val(); 
  var streetaddress = $("input#StreetAddress_input").val(); 
  var streetaddress2 = $("input#StreetAddress2_input").val();
  var city = $("input#City_Input").val(); 
  var state = $("input#StateInput").val(); 
  var zipcode = $("input#ZipCode").val(); 
  var month = $("input#month_input").val(); 
  var day = $("input#day_input").val(); 
  var year = $("input#year_input").val(); 
  var services = $("input#services_input").val(); 
  var agreement = $("input#agreement").val(); 

  var dataString = 'firstname=' + firstname + '&lastname=' + lastname + '&areacode=' + areacode + '&phonenumber=' + phonenumber + '&emailaddress=' + emailaddress + '&confirmemail=' + confirmemail + '&password=' + password + '&streetaddress=' + streetaddress + '&streetaddress2=' + streetaddress2 + '&city=' + city + '&state=' + state + '&zipcode=' + zipcode + '&month=' + month + '&day=' + day + '&year=' + year + '&services=' + services + '&agreement=' + agreement; 
  alert(dataString); 
  $.ajax({
        type: "POST",
        url: "http://www.vectorcreditsolution.com/js/process.php",
        data: dataString,
            success: function() {
            alert("Yay it was sent"); 
    }
        });
        return false;
     });

and then my php file

<?php
    $FirstName = $_POST["firstname"];  
    $LastName = $_POST['lastname']; 
    $AreaCode = $_POST['areacode']; 
    $PhoneNumber = $_POST['phonenumber']; 
    $EmailAddress = $_POST['emailaddress']; 
    $Password = $_POST['password']; 
    $StreetAddress = $_POST['streetaddress']; 
    $StreetAddress2 = $_POST['streetaddress2']; 
    $City= $_POST['city']; 
    $State = $_POST['state']; 
    $ZipCode = $_POST['zipcode']; 
    $Month = $_POST['month']; 
    $Day = $_POST['day']; 
    $Year= $_POST['year'];
    $Service=$_POST['services']; 

    var_dump($_POST["firstname"]); 
    var_dump($_POST['firstname']); 
    var_dump($_POST[firstname]);

Instead of doing this manually, use [ajaxForm or serialize](http://stackoverflow.com/a/1960245/797303) — Maxim Krizhanovsky, Jan 17 '12 at 15:56
Silly Question: What steps are you taking to view your PHP file to test if $_POST is populated? Are you using firebug to check the response? — DampeS8N, Jan 17 '12 at 16:13

score 5 · Answer 1 · answered Jan 17 '12 at 15:57

5

Try posting data as a Javascript dictionary, not as a big string:

$.ajax({
    // ...
    data: {
        firstname: firstname,
        lastname: lastname,
        // etc.
    }
});

answered Jan 17 '12 at 15:57

millimoose

36,982
8
75
128

thank you for responding :-) I tried it out and it's still empty data: { firstname: firstname, lastname: lastname, areacode: areacode, phonenumber: phonenumber, emailaddress: emailaddress, password: password, streetaddress: streetaddress, streetaddress2: streetaddress2, city:city, state: state, zipcode:zipcode, month: month }, – user1154295 Jan 17 '12 at 16:12

DampeS8N · Accepted Answer · 2012-01-17T16:34:02.887

You aren't outputting the returned data from the AJAX and you aren't using a tool to view it. Perhaps you are expecting the var dumps to appear on the page. They will not, they will be returned into the success function where you can use the data how you see fit.

jQuery's AJAX method will pipe the output from your PHP file into the 'ret' variable inside the success function. If you wish to return an HTML success message, for example, you can then add that HTML to the page without refreshing it. Or any of a million things.

You should read up on AJAX.

Change This:

$.ajax({
type: "POST",
    url: "http://www.vectorcreditsolution.com/js/process.php",
    data: dataString,
    success: function() {
        alert("Yay it was sent"); 
    }
});

To This:

$.ajax({
type: "POST",
    url: "http://www.vectorcreditsolution.com/js/process.php",
    data: dataString,
    success: function(ret) {
        alert(ret); 
    }
});

And then click your button on the page with the jQuery.

Do not combine this with the other answers on this page. One is going to change your array keys on you (serialize).

Do not use your [php file](http://www.vectorcreditsolution.com/js/process.php) directly. I assume "Test" is the value you entered into the form? The AJAX response (alert box) shows you what the PHP output. — DampeS8N, Jan 17 '12 at 16:30

score 0 · Answer 3 · answered Jan 17 '12 at 16:15

0

I would use the serialize() jquery function. Rather than look for each fields value serialize the entire form

$("#form-id").serialize();


$.ajax({
    type: "POST",
    url: "http://www.vectorcreditsolution.com/js/process.php",
    data: $("#form-id").serialize(),
        success: function() {
        alert("Yay it was sent"); 
}
    });
    return false;
 });

answered Jan 17 '12 at 16:15

VictorKilo

1,819
2
24
38

This will change their array keys on them. – DampeS8N Jan 17 '12 at 16:28
It would change them to the field name in the form. Usually isn't all that detrimental, but they would have to modify their php. – VictorKilo Jan 18 '12 at 22:30

Submitting From jQuery to PHP

3 Answers3