Click here to Skip to main content
15,881,852 members
Articles / Web Development / ASP.NET
Article

How to get the HTML source code from an editable Iframe, on the server.

Rate me:
Please Sign up or sign in to vote.
3.44/5 (13 votes)
25 Mar 20031 min read 185.8K   29   38
Getting the HTML source code from an editable Iframe, on the server

Introduction

There are some times when you want to obtain the HTML source code from an editable Iframe, on the server side of the world, and this article gives a very simple example of that.

The ASP.NET form

ASP.NET
<%@ Page Language="vb" AutoEventWireup="false" 
                Codebehind="test.aspx.vb" Inherits="test"%>
<form id=frmMain method=post runat="server">
    <iframe id=ifrHTML name=ifrHTML runat="server"></iframe>
    <asp:Button id=cmdSend runat="server" Text="Send"></asp:Button>
    <input type=hidden name=hidValue>
</form>
<script>
    //Set the IFRame to Desing Mode.
    ifrHTML.document.designMode = "on";            
</script>

As you can see from the code above we have the Iframe, a submit button, and a hidden field.

We will need the hidden field to store the value of the innerHTML value of the Iframe in the client side, so we can submit later the hidden field into the server side code.

CodeBehind

VB
Private Sub Page_Load(ByVal sender As System.Object, _
        ByVal e As System.EventArgs) Handles MyBase.Load
    cmdSubmit.Attributes.Add("onClick", _
       "document.frmMain.hidValue.value = ifrHTML.document.body.innerHTML;")
End Sub

Private Sub cmdSubmit_Click(ByVal sender As System.Object,_
     ByVal e As System.EventArgs) Handles cmdSubmit.Click
    Dim strValue As String

    strValue = Request.Form("hidValue")
End Sub

First we'll take a look at the Page_Load function. As you can see there's just a simple attribute addition to the cmdSubmit button. We added the onClick event, so whenever the user clicks this button, the value of the HTML source within the editable Iframe, will be stored on the hidden field hidValue.

Now the cmdSubmit_Click event. Here's where we actually get the HTML source that the Iframe passed to the hidden field on the client side, and we get it by a simple Request.Form of the hidden field, and store it into the string variable strValue.

That's it, you now have the HTML source code of an editable Iframe into a string variable on the server.

Conclusion

There are many ways of storing the HTML source code of an Iframe into the server side, this is just one of them. I hope you find it useful.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Web Developer
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
GeneralThanks! But in FireFox a little bit different... Pin
Enigmatic22-Jan-09 0:44
Enigmatic22-Jan-09 0:44 
QuestionHow to display an html file inside Iframe --need urgent help Pin
Vishnu Narayan Mishra15-Nov-07 19:00
Vishnu Narayan Mishra15-Nov-07 19:00 
Questionhow to dynamically refresh iframe when hosting through IIS Pin
naresh26929-Oct-07 23:01
naresh26929-Oct-07 23:01 
GeneralReceiving Nothing Pin
.NET- India 8-Sep-07 4:34
.NET- India 8-Sep-07 4:34 
GeneralC# Pin
Manhhm2-Apr-06 18:31
Manhhm2-Apr-06 18:31 
GeneralRe: C# Pin
Hugo Flores11-Apr-06 6:43
Hugo Flores11-Apr-06 6:43 
GeneralEmpty String, doesn't work. Pin
bswiftly14-Sep-04 4:10
bswiftly14-Sep-04 4:10 
GeneralRe: Empty String, doesn't work. Pin
Hugo Flores14-Sep-04 4:31
Hugo Flores14-Sep-04 4:31 
GeneralRe: Empty String, doesn't work. Pin
bswiftly14-Sep-04 4:46
bswiftly14-Sep-04 4:46 
GeneralRe: Empty String, doesn't work. Pin
Hugo Flores14-Sep-04 5:38
Hugo Flores14-Sep-04 5:38 
GeneralRe: Empty String, doesn't work. Pin
bswiftly14-Sep-04 8:46
bswiftly14-Sep-04 8:46 
GeneralRe: Empty String, doesn't work. Pin
bswiftly14-Sep-04 8:54
bswiftly14-Sep-04 8:54 
GeneralRe: Empty String, doesn't work. Pin
Hugo Flores14-Sep-04 9:43
Hugo Flores14-Sep-04 9:43 
GeneralRe: Empty String, doesn't work. Pin
Hugo Flores14-Sep-04 9:38
Hugo Flores14-Sep-04 9:38 
GeneralRe: Empty String, doesn't work. Pin
bswiftly14-Sep-04 9:50
bswiftly14-Sep-04 9:50 
GeneralRe: Empty String, doesn't work. Pin
bswiftly14-Sep-04 14:45
bswiftly14-Sep-04 14:45 
GeneralRe: Empty String, doesn't work. Pin
Hugo Flores15-Sep-04 1:31
Hugo Flores15-Sep-04 1:31 
GeneralRe: Empty String, doesn't work. Pin
bswiftly15-Sep-04 3:35
bswiftly15-Sep-04 3:35 
GeneralRe: Access Denied Pin
bswiftly15-Sep-04 12:12
bswiftly15-Sep-04 12:12 
GeneralRe: Access Denied Pin
Hugo Flores16-Sep-04 2:50
Hugo Flores16-Sep-04 2:50 
GeneralRe: Access Denied Pin
bswiftly16-Sep-04 12:05
bswiftly16-Sep-04 12:05 
GeneralDoes Not Accept Formatting of Text Pin
L anthony Johnson20-Nov-03 10:08
sussL anthony Johnson20-Nov-03 10:08 
QuestionAnd what about putting source on an IFrame? Pin
Nuno Ferro9-Sep-03 7:04
Nuno Ferro9-Sep-03 7:04 
AnswerRe: And what about putting source on an IFrame? Pin
Hugo Flores9-Sep-03 7:17
Hugo Flores9-Sep-03 7:17 
I'm not sure what you mean, but if you want to know how to make the IFrame editable, then it's right there in the code above.
But here it is anyway.

Just put the following


//Set the IFRame to Desing Mode.
ifrHTML.document.designMode = "on";


Where ifrHTML is the IFrame name and id

P.S. I'd appreciate if you'd rate the article

Cheers! Cool | :cool:

With great Project Management comes great Responsibility!!
GeneralRe: And what about putting source on an IFrame? Pin
Nuno Ferro9-Sep-03 7:36
Nuno Ferro9-Sep-03 7:36 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.