XMLHttp Request problem

[Cobb]

I've written a XMLHtttpRequest, but something is breaking down somewhere.

PHP Code:

function submit(){
     // declaring variables to be used
    var xhr, target, changeListener, url, data;

    //setting url to the php code to add comments to the db
    url = "createCampaign.php";
    data = document.getElementById("source").innerHTML;
    console.log("Sending", data);

    // create a request object
    xhr = new XMLHttpRequest();

    changeListener = function () {
        if (xhr.readyState == 4) {
            if (xhr.status == 200) {
                console.log("Response", this.responseText);
    //            result = JSON.parse(this.responseText);
                //injectContent(result.id, form);
            }
        }
    };

    // initialise a request, specifying the HTTP method
    // to be used and the URL to be connected to.
    xhr.onreadystatechange = changeListener;
    xhr.open('POST', url, true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send(data);

    return false;
} 


I've tried changing the data variable so that it contains just a simple string but it still does not work.

In the PHP script i'm trying to see if anything has been received by using this line 'echo $_REQUEST['data'];' but it appears that nothing has been sent.

Any help will be greatly appreciated.
Thank you.

[nomanic]

it might be that xhr is private to the outer function, and will be unknown inside the inner function of changelistener? try making it a page variable that has scope right across all the functions

[devnull69]

Two mistakes

1. data is just a plain string. It should be in the format "key1=value1&key2=value2&...." so that you can access the data using $_POST["key1"] and $_POST["key2"] in PHP

2. Try to replace this.responseText with xhr.responseText

[Cobb]

Yeah i just noticed the first mistake, but now I cant work out how to write that line.
data = 'html=document.getElementById("source").innerHTML'; sends it a string instead of the contents of the innerHTML.

The second line you pointed out works fine as 'this.'.

[nomanic]

data = 'html='+escape(document.getElementById("source").innerHTML);

[devnull69]

If you want to support non-english characters using utf-8 you should use encodeURIComponent() instead of escape()

[Cobb]

Thanks for all your help, it worked. Although i realised in the end that sending it through as a form was most functional for what I was doing.