Decode a Javascript array of objects in PHP via query parameters passed via AJAX without using jQuery

[tuffyMadison]

The script works when I give PHP literal values. However, when I attempt to decode and use the values sent from Javascript/ajax… I’ve tried every possible combination of accessing the array of objects in the PHP script.

I am sending this to my PHP script via ajax:

 resultSet.push({"lat": position.coords.latitude});
 resultSet.push({"lng": position.coords.longitude});

 xmlhttp.open("GET","geolocation.php?q="+resultSet,true);
 xmlhttp.send();

I am attempting to decode in my PHP script:

$data = $_GET['resultSet'];
$json = json_decode($data);
$qLat = $json->resultSet[0]->lat;
$qLng = $json->resultSet[1]->lng;

This is the parsed query string parameters I got from the console dev tool when I made the request:

[object Object],[object Object]

This is what I logged to the console from the JavaScript. It is what I sent as the query parameters:

Object {lat: 39.864823}
Object {lng: -83.0616022}

This is the error message I received. Also to reiterate, This does work when I pass the PHP script literal values, so I know the script is working, I’m just not getting the sending and decoding part. Obviously there is more to the code that I’m not showing, but I think this is the relevant parts:

GET http://localhost:8080/yardsalendipity/geolocation.php?q=[object%20Object],[object%20Object] 500 (Internal Server Error)

[Lemon_Juice]

@tuffyMadison

xmlhttp.open(“GET”,“geolocation.php?q=”+resultSet,true);

This cannot work because javascript doesn’t turn arrays and objects into json by default, you need to do it yourself. Try this:

xmlhttp.open("GET","geolocation.php?q="+encodeURIComponent(JSON.stringify(resultSet)), true);

[tuffyMadison]

Thanks, still not getting it though. Does it look as though I have the PHP script set up correctly to decode it? The syntax seems that it should be Array[index]['val'] if I set json_decode to true for getting back an array. Something like $json[0]['lat]

[Lemon_Juice]

Yes, the PHP code has a problem, too. From javascript you are sending an array of objects but you want to access it like an array of arrays. In you sample code above you are trying to access a resultSet object, which doesn’t exist because you are not sending anything called resultSet. You are sending an array of objects, therefore, this should work:

$data = $_GET['q'];
$json = json_decode($data);
$qLat = $json[0]->lat;
$qLng = $json[1]->lng;

Or getting data as arrays:

$data = $_GET['q'];
$json = json_decode($data, true);
$qLat = $json[0]['lat'];
$qLng = $json[1]['lng'];

Anyway, you are making the structure more complex than it needs to be because in javascript you are building an array of 2 objects: one object has lat property while the other has lng property, which is wasteful because you don’t need two array elements and two objects at the same time just for two values. You either need an array with two elements or an object with two elements. I’d choose the object because objects can have named elements in javascript. Therefore, I would pass the data like this:

var resultSet = {
  "lat": position.coords.latitude,
  "lng": position.coords.longitude
};

xmlhttp.open("GET","geolocation.php?q="+encodeURIComponent(JSON.stringify(resultSet)),true);
xmlhttp.send();

and in PHP:

$data = $_GET['q'];
$json = json_decode($data);
$qLat = $json->lat;
$qLng = $json->lng;

or:

$data = $_GET['q'];
$json = json_decode($data, true);
$qLat = $json['lat'];
$qLng = $json['lng'];

[tuffyMadison]

Yes, that works. Thank you. I do also appreciate the tip of how I was over complicating it. Funny, I usually try to avoid that, but new territory made me nervous I guess. as far as stringify goes, I was attempting to use that before but wasn’t sure how it worked between JS and PHP. I think now I see that it takes any JS value and wraps it in a string? Then PHP decodes that into an object or an array on the other end? I had also just ran across encodeURIComponent. That is similar to PHP urlencode?
Thanks again ~

[Lemon_Juice]

@tuffyMadison

I think now I see that it takes any JS value and wraps it in a string?

We can say that, the more appropriate term would be it serializes (almost) any JS value into a string. JSON.stringify() is the equivalent of PHP json_encode() - it simply encodes the value in JSON.

@tuffyMadison

I had also just ran across encodeURIComponent. That is similar to PHP’s urlencode?

Yes, encodeURIComponent() is the equivalent of PHP’s urlencode().

@tuffyMadison

I do also appreciate the tip of how I was over complicating it.

Actually, I only pointed out how passing the values via JSON can be simplified - but in actual fact, I think the simplified version is still overcomplicated because you don’t need JSON at all just to pass two values in a URL. You can pass the values directly as URL parameters:

xmlhttp.open("GET","geolocation.php?lat="+position.coords.latitude+"&lng="+position.coords.longitude,true);
xmlhttp.send();

and then access these values directly with $_GET['lat'] and $_GET['lng']. JSON is very well suited in situations where you can only send a single plain string value but you want to send a more complex data structure like arrays or objects. Here, you can already send separate values in the URL as named parameters so JSON is not necessary for such simple stuff.

Usually, JSON is used in the other direction of ajax calls - when you want to pass a set of values from PHP to javascript - then you can’t use URL parameters because the URL request is made from javascript and PHP can only send back a response as a single string sequence - then you can encode all your complex data in a JSON string and decode it with JSON.parse() in javascript.