Skip to content

Sending Javascript Object to PHP via Ajax

I’m learning Ajax by failure and have hit a wall:

I have an array (if it matters, the array is storing number id’s based on what checkboxes the user checks) that is written in Javascript.

I have a function that is called when the user clicks the ‘save’ button. The function is as follows:

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 (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById('message').innerHTML = xmlhttp.responseText;
        }
    }

    var url = "create_amenities.php";

    xmlhttp.open("GET", url, true);

    xmlhttp.send();

}

My question is: What can I put in this function to pull the array into the php script I’m trying to call (‘create_amenities.php’)?

furthermore, should I try using JSON? And if so, how could I send a JSON object via ajax?

Thanks in advance.

Answer

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));