iFrame : How to display a server response (HTML) directly into iFrame using javascript?

Question

I am getting a simple server response which is an html file and I want to display the same in iFrame without saving the file to my workspace or machine.

I am making an ajax call as below.

                   Ext.Ajax.request({
                        url : 'url',
                        method : 'POST',
                        success : function(response) {

                        var responseHtmlStr =response.responseText;

Sample Server response which I am getting in responseHtmlStr is as below.

<!DOCTYPE html>
<html>
<head>
<script>
function copyText()
{
alert('It is clicked');
}
</script>
</head>
<body>

Field1: <input type="text" id="field1" value="Hello World!"><br>
Field2: <input type="text" id="field2">
<br><br>
<button onclick="copyText()">Copy Text</button>

</body>
</html>

The code I am using to create the iFrame is as below.

;

As I dont want to store the server response in the server in a file. How to directly feed the server response in the iFrame?

I tried document.getElementsByTagName('iframe')[0].contentWindow.document.write(serverResponse); but it is not working with the above code.

Any other suggestions please. Thanks in advance.

Thanks Gendaful

The current page is the server response. Do you want to copy the current page content to the Iframe? — Diodeus - James MacFarlane
– Diodeus - James MacFarlane, Commented Mar 12, 2013 at 19:38
How are you generating your response? Are you using a framework, or are you writing the AJAX call yourself? — Gareth Cornish
– Gareth Cornish, Commented Mar 12, 2013 at 19:38
Also, do you need to make a POST request, or will a GET request do? — Gareth Cornish
– Gareth Cornish, Commented Mar 12, 2013 at 19:44
@Diodeus : Yes. The html shown above is the server response. I want to show it in the iFrame. My main confusion is to how to feed the server response directly to iFrame. I have kept a code here so you may try it. senchafiddle.com/#GBOYZ — Gendaful
– Gendaful, Commented Mar 12, 2013 at 21:13
document.MyFrame.document.body.innerHTML = serverResponse, where you have <iframe name="MyFrame"></iframe> — Diodeus - James MacFarlane
– Diodeus - James MacFarlane, Commented Mar 12, 2013 at 21:38

Diodeus - James MacFarlane · Accepted Answer · 2013-03-13 14:14:54Z

7

With vanilla JavaScript:

document.MyFrame.document.body.innerHTML = serverResponse

..where you have <iframe name="MyFrame"></iframe>

answered Mar 13, 2013 at 14:14

Diodeus - James MacFarlane

115k33 gold badges164 silver badges180 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

SimpleSam5 · Accepted Answer · 2013-03-12 19:34:44Z

0

Not sure if this will work, I do something similar using jquery (but could do it just as easily without)...

$('iframe').contents().find("html")
    .append($("<head></head><body> blah blah blah </body>"));

answered Mar 12, 2013 at 19:34

SimpleSam5

3,4302 gold badges19 silver badges14 bronze badges

Collectives™ on Stack Overflow

iFrame : How to display a server response (HTML) directly into iFrame using javascript?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related