Sirish Kumar Bethala
Sirish Kumar Bethala

Reputation: 9279

Inject another page using java script

I have a need to inject some data which is present in another page(url) on the current page load. Below is the code I am using.But it doesnt work, is there is a problem with below code and how can I debug this issue?

function loadHTML(url, storage)
{
    var xhr = createXHR();
    xhr.onreadystatechange=function()
    { 
        if(xhr.readyState == 4)
        {
            //if(xhr.status == 200)
            {
                storage.innerHTML = getBody(xhr.responseText);
            }
        } 
    }; 

    xhr.open("GET", url , true);
    xhr.send(null); 

} 


function loadWholePage(url)
{
    /**
        storage is the div id where I want to inject html
    */
    var y = document.getElementById("storage");
    loadHTML(url, y);
}   


window.onload = function()
{
   loadWholePage('link_to_the_page') ;
};

Upvotes: 0

Views: 70

Answers (2)

StarPinkER
StarPinkER

Reputation: 14281

You hit a cross domain scripting problem. See Same Origin Policy.

As far as I know, JSONP can help you on this problem.

JSONP(JSON with Padding) provides a method to request data from a server in a different domain, something prohibited by typical web browsers because of the same origin policy.

Upvotes: 1

rahul
rahul

Reputation: 100

There might be some issue with your function createXHR() and getBody(). Post the code you have written for those function. Moreover for debugging, you can put a console.log before calling getBody() and check what is responseText.

if(xhr.readyState == 4)
{
if(xhr.status == 200)
{
console.log(xhr.responseText);
storage.innerHTML = getBody(xhr.responseText);
}
} 

Upvotes: 0

Related Questions