Form Posting using IFrame Inside a Web User
Control
What is Iframe?
An iframe is used to display a web page within a web page
Syntax-
<iframe src="URL"></iframe>
Now lets Start with creating a Html page that will be called in a web user
control.
Create a html form with test.html name
<html>
<head>
<title></title>
<link href="/css/hcs/site.css"
temp_href="/css/hcs/site.css"
rel="stylesheet"
type="text/css"
/>
</head>
<div
class="request_form">
<form
action="http://abc.com/get.html"
class="request_form"
enctype="application/x-www-form-urlencoded"
id="Form"
method="post"
name="Form"
>
<table>
<tr>
<th>
<label>*
First Name:</label>
</th>
<th>
<label>*
Last Name:</label>
</th>
</tr>
<tr>
<td>
<input
class='input_txt1'
id="FirstName"
maxlength='255'
name="FirstName"
tabindex='1'
type='text'
value="" /
>
<br>
</td>
<td>
<input
class='input_txt1'
id="LastName"
maxlength='255'
name="LastName"
tabindex='2'
type='text'
value="" /
>
<br>
</td>
</tr>
<tr>
<th>
<label>*
Company Name:</label>
</th>
<th>
<label>*
Email Address:</label>
</th>
</tr>
<tr>
<td>
<input
class='input_txt1'
id="Company"
maxlength='255'
name="Company"
tabindex='3'
type='text'
value="" />
<br>
</td>
<td>
<input
class='input_txt1'
id="Email"
maxlength='255'
name="Email"
tabindex='4'
type='text'
value=""
/>
<br>
</td>
</tr>
<tr>
<td
colspan="2"
align="right">
<input
id='FrmSubmit'
name='submitButton'
class="input_submit"
type='submit'
value='Submit'
onclick='return
validate();' >
</td>
</tr>
</table>
</form>
<script
type="text/javascript">
function validate() {
var FirstName = document.getElementById('FirstName').value;
var LastName = document.getElementById('LastName').value;
var Company = document.getElementById('Company').value;
var Email = document.getElementById('Email').value;
var errors = "";
if (FirstName == "")
{
errors +=
"Please enter your First name.\n";
}
if (LastName == "")
{
errors +=
"* Please enter your last name.\n";
}
if (Company == "")
{
errors +=
"* Please enter your company name.\n";
}
if (Email == "")
{
errors +=
"* Please enter your email address.\n";
}
if (errors.length) {
alert('One
or more errors occurred:\n\n' + errors);
return false;
}
}
</script>
</div>
</html>
Now Go to project+right click and add new item, select webusercontrol and rename
as IFrame.ascx then click on ok.
Add the following code on that page.
<div>
<iframe
src="test.html"
temp_src="test.html"
style="width:
715px;height:600px;border:0"
scrolling="no"></iframe>
</div>
Now add a default.aspx page to your project and register the control on page.
<%@ Register src="~/IFrame.ascx" TagName="frame"
TagPrefix="uc2" %>
Now last step, Add web user control to your page, i am listing the html code
here.
<%@
Page Language="C#"
AutoEventWireup="true"
CodeFile="Default.aspx.cs"
Inherits="_Default"
%>
<%@
Register Src="~/IFrame.ascx"
temp_src="~/IFrame.ascx"
TagName="frame"
TagPrefix="uc2"
%>
<!DOCTYPE
html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head
id="Head1"
runat="server">
<title></title>
</head>
<body>
<form id="form1"
runat="server">
<div>
<uc2:frame
ID="frame1"
runat="server"
/>
</div>
</form>
</body>
</html>
Now run the project and you will see that form posting is working with help of
IFrame