Question

I have an iframe container inside the body section and a button.
Any click upon the button makes a call to server and fetches some html content.
Now I want the html content which comes as response from my server to be placed inside the iframe. Here is the code I am doing:-

var url = 'http://www.google.com';
    var request = new XMLHttpRequest();
    var serverURL = "http://localhost:8080/myServer/getPage.htm";
    request.open('GET', serverURL + '?url=' + url, false);
    request.send(null);
    if(request.status == 200) {
        console.log(request.responseText);
        var resp = eval('(' + request.responseText + ')');
        var data = resp[0].data;
        //alert(data);
        var path = 'http://localhost:8080/test/about.html';
        $("#newPage").attr('src',data);
    }

On alerting data variable it is giving me correct html code but the last line is not working. I don’t know where i am doing wrong. For testing purpose I placed path instead of data then it worked perfectly. Please help!

Answer 1

I think there is difference between string (javascript variable data here) and an actual html page. You might need to save your data variable in some html page and then update your iframe. I am not too sure about my solution. Check this out How do I dynamically change the content in an iframe using jquery?