Use innerHTML to reload the center pane of the page

html, innerhtml, javascript

Solution

If you are not using jQuery or another library with built in ajax methods:

var setHtml = function (element, url) {

    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && xhr.status == 200) {
            element.innerHTML = xhr.responseText;
        }
    };

    xhr.timeout = 10000;
    xhr.open('GET', url, true);
    xhr.send();
};

Then simply call the setHtml function like this:

setHtml(document.getElementById('centerPane'), 'SampleHTML.htm');

Problem

Instead of using the iframe, I want to use the following method to update the center pane of the page. I would like to get some help on the following. If have another HTML page I want to load into the center pane, what would be the right syntax for it? ``` document.getElementById( 'centerPane' ).innerHTML.??? = 'SampleHTML.htm' ; ``` What attribute do I need to get after innerHTML? Or should I do it using some other calls.

Original source