传递的Ajax参数返回undefined

Question

I am posting an Ajax call to a PHP function but all the data passed is "UNDEFINED". When I debugged the JQuery, the value seems work. The undefined is at server side. PHP side.

$('.js-checkout-shipping-submit').on('click', function(e) {

$.ajax({
  // Change the URL to the right one
  url: 'index.php?route=checkout/checkout/updateShippingAddress',
  type: 'post',
  dataType: 'json',
  data: 'firstName:' + $(' .js-checkout-firstName').val() +
        ',lastName:' + $('.js-checkout-lastName').val() +
        ',address:' + $('.js-checkout-address').val() +
        ',zipcode:' + $('.js-checkout-zipcode').val()  ,
  success: function(data) {

    if(data['status'] === "pass"){
      console.log("success");
    }

    if(data['status'] === "fail") {
      console.log("fail");
    }
  },
  error: function(data) {
  }
});

e.preventDefault();

});

 public function updateShippingAddress(){

    $firstName=$this->request->post['firstName'];
    $lastName=$this->request->post['lastName'];
    $address=$this->request->post['address'];
    $zipCode=$this->request->post['zipcode'];
}

Answer 1

You are posting the JSON object as string, please try this

data: { // making the data to become object
   firstName : $('.js-checkout-firstName').val(),
   lastName : $('.js-checkout-lastName').val(),
   address : $('.js-checkout-address').val(),
   zipcode : $('.js-checkout-zipcode').val()
 },
 success: function(data) {
 ...

If you are getting undefined as value of post params, maybe there is jQuery selector problem.

Try to log $('.js-checkout-firstName').val() and see what you get and make shre an Input is present with class .js-checkout-firstName