Sending Javascript Object to PHP via Ajax
If your array has more then 1 dimension or is an associative array you should use JSON.
Json turns a complete array structure into a string.This string can easily send to your php application and turned back into a php array.
More information on json: http://www.json.org/js.html
var my_array = { ... };var json = JSON.stringify( my_array );
In php you can decode the string with json_decode:
http://www.php.net/manual/en/function.json-decode.php
var_dump(json_decode($json));
Loop over the array and append encodeURIComponent('keyname[]') + '=' + encodeURIComponent(theArray[i]) + '&'
to the query string each time.
furthermore, should I try using JSON?
You could, but it would mean decoding JSON at the other end instead of letting normal form handling take care of it.
And if so, how could I send a JSON object via ajax?
There is no such thing as a JSON object. JSON takes the form of a string, and you can include strings in query strings (just remember to encodeURIComponent
).
I found this question useful for Javascript enthusiasts.
Sending a javascript Object, be it js array or js object, you must stringify the setup before putting it to the server for decode & processing.
Stringifying a js object:Based on your function:
case of Javascript Array object
let my_array = ["select1", "select2", "..."];my_array = JSON.parse(my_array);
case of Javascript Object object
let my_obj = {name: "Daniel",age: 23,location: "Nigeria"}my_obj = JSON.parse(my_obj);
Ones on point you can push this to the server, as per use case, u're working with AJAX GET method in sending your stringified object to the server.
Here is the full code:
function createAmenities() { if (window.XMLHttpRequest) { //code for IE7+, Firefox, Chrome and Opera xmlhttp = new XMLHttpRequest(); } else { //code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { console.log(this.responseText); document.getElementById('message').innerHTML = this.responseText; // if your returned response is in json, please, do ensure to parse the response before displaying // like this JSON.parse(this.responseText) } } let my_array = ["select1", "select2", "..."]; my_array = JSON.stringify(my_array); var url = "create_amenities.php?my_json=" + my_array; xmlhttp.open("GET", url, true); xmlhttp.send();}
Here are what i noticed out of your codes:
- You don't need to call
xmlhttp
inside of xmlhttp object again, all you need is thethis
I included the my_json parameter that holds the array object you are sending to the server.
Now, here in the server, you will need to catch the object and convert it to php readable object.
$my_json = $_GET['my_json'];$my_json = json_decode($my_json);
Now, you can do whatever you wish it, because it has now become a full php array.Example to pick the first array option:
$first = $my_json[0];echo json_encode($first) // hahaha, you echoed it for AJAX to display// i used to json_encode() to convert from php object to a js readable object