Hi Friends, in this article I will explain about what is
User control? How to create and use User Control in asp.net.
- User controls (.ascx pages) allow you to save a part of an existing ASP.NET page and reuse it in many other ASP.NET pages ex:header , footers.
- A user control is almost identical to a normal .aspx page, with differences: the user control has the .ascx extension rather than .aspx, we cannot run the .ascx page individual and it may not have <HTML>, <Body>, or <Form> tags.
I explain this with small example.
First of all create one .ascx file.
Right click on project root folder ---Add new item ---
select webusercontrol (.ascx) and name it as menu.ascx.
write the following code in menu.ascx page
<%@ Control Language="VB" AutoEventWireup="false" CodeFile="Menu.ascx.vb" Inherits="Menu" %>
<style type
="text/css" >
.menu ul{
margin: 0; padding:0.5;
float: left;}
.menu ul li{
display: inline;}
.menu ul li a{
float: left; text-decoration:
none;
color: white;
font-size:10px;
padding: 10px 10px;
background-color:
#a31515; }
.menu ul li a:visited{
color: white;
font-weight:bold;}
.menu ul li a:hover, .menu ul li .current{
color: #fff;
}
.hand1
{cursor:pointer;cursor:hand;}
.add_now_text
{font-weight:bold;padding-left:1px;background-
color:#fff;background-repeat: repeat-x;font-size:smaller;display:block;
}
</style>
<form id="form1" runat="server">
<div>
<div class="menu">
<ul>
<li><a href="http://aspdotnet-roja.blogspot.in/">Home </a></li>
<li><a href="http://aspdotnet-roja.blogspot.in/search/label/ASP.NET">ASP.NET
</a></li>
<li><a href="http://aspdotnet-roja.blogspot.in/search/label/InterviewQuestions
">Interview Questions</a></li>
<li><a href="http://autolisp-kishore.blogspot.in">AutoCAD </a></li>
<li><a href="http://facebook.com/aspdotnetroja">Find me on
Facebook</a></li>
<li><a href="http://www.twitter.com/aspdotnetroja">Find me on
Twitter</a></li>
<li><a href="http://aspdotnet-roja.blogspot.in/2012/10/contact-us.html">Contact me </a></li>
</ul></div></div></form>
|
And take one .aspx page and name it as login.aspx and write
the following code.
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="login.aspx.vb" Inherits="login" %>
<!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 runat="server">
<title>User
control Page</title>
</head>
<body>
<form id="form1" action="login.aspx" >
<br />
<div>
Username: <input type="text" name="usr_name"/><br />
Email
:
<input type="text"
name="usr_name"/>
<br />
<input type="submit" value="Submit "/>
</div>
</form>
</body>
</html>
|
Save the page and run it will like below.
Add the .ascx page to Login.aspx page like below.
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="login.aspx.vb" Inherits="login" %>
<%@ Register TagPrefix="head" TagName="menu" Src="~/Menu.ascx" %>
<!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 runat="server">
<title>User
control Page</title>
</head>
<body>
<form id="form1" action="login.aspx" >
<head:menu ID="menu" runat="server" />
<br />
<div>
<br />
<br />
<br />
<br />
Username: <input type="text" name="usr_name"/><br />
Email
:
<input type="text"
name="usr_name"/>
<br />
<input type="submit" value="Submit "/>
</div>
</form>
</body>
</html>
|
And run the page. The page will like below and see the difference;
it shows the menu of .ascx page.
No comments:
Post a Comment