In web development often some code is repeated in many places, such as navigation bar, user login/registration and a number of fixed columns above the home page. These reusable code can be written as a common module for the need to reference, which saves the development time and convenient maintenance later.
A "user control" is provided in asp.net Web programming to help us do this, with the file name extension ". ascx", because the ascx file is used to insert into the ASPX page, and an ASPX form can contain only one <form> flag, Therefore, the Ascx user control cannot contain <form></form> flags.
1. Use a classic introductory example to create a simple user control:
Hello.ascx
<body>
</body>
Save this code as a Hello.ascx file and call it on the ASPX page, as follows:
Hello.aspx
<% @Register tagprefix= "Wen" tagname= "Hello" src= "Hello.ascx"%>
<body>
<form id=frm runat=server>
<wen:hello Id=myhello runat=server>
</form>
</body>
Enter http://localhost/Hello.aspx running in the address of IE browser, will print out the string "Hello word" on the page.
Code Description: 1 The instruction @register defines the user control file's tag name "Hello" and the tag prefix name "Wen".
2 The SRC attribute is the associated filename connected to the user control;
3) <wen:hello Id=myhello runat=server> This is the statement that invokes the user control Hello.ascx in an ASPX form.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
2, the following demo code to add properties to the control
Here we take a user login file, write it as a user control, add username and password to the two properties.
Adding a property to a user control is simple, as long as it is defined in the <script></script> block in the ascx file. Now that we've added the username and Password properties to the Userlogin.ascx file, the following demo demonstrates how to reference both properties on an ASPX page.
Userlogin.ascx
<title> User Login </title>
<body>
<table>
<tr>
<td> User name:</td>
<td><asp:textbox id= "txt1" runat= "Server" ></td>
</tr>
<tr>
<td> Password:</td>
<td><asp:textbox id= "txt2" textmode= "password" runat= "Server" ></td>
</tr>
<tr>
<td></td>
<td><asp:linkbutton text= "Landing" runat= "Server" ></td>
</tr>
</table>
</body>
<script language= "C #" runat= "Server" >
public string username{
Get{return txt1. Text;}
Set{txt1. Text=value;}
}
public string password{
Get{return txt2. Text;}
Set{txt2. Text=value;}
}
</script>
Userlogin.aspx
<% @Register tagprefix= "Wen" tagname= "Userlogin" src= "Userlogin.ascx"%>
<title> Reference Properties </title>
<body>
<form runat= "Server" >
<wen:userlogin id= "MyLogin" runat= "Server" >
</form>
User name: <asp:label id= "LAB1" runat= "Server"/><br>
Password: <asp:label id= "LAB2" runat= "Server"/><br>
</body>
<script language= "C #" runat= "Server" >
void Page_Load (Object Sender,eventargs e) {
if (IsPostBack) {
Lab1.text=mylogin.username;
Lab2.text=mylogin.password;
}
}
</script>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
3, the following demo code to add events to the control
Above we defined a user login user control Userlogin.ascx file, which contains a LinkButton Server button control, when the user clicks the button, the server will automatically generate a postback to fire the Page.load event. In addition to the server automatically generating a postback to trigger the Page.load event, we can add an event to LinkButton, which is also very simple to add, by declaring the event in the <script></script> block, The event is then added to the user control.
We now use the following examples to illustrate how to add events to the Userlogin.ascx user control. Userlogin.ascx
<title> User Login </title>
<body>
<table>
<tr>
<td> User name:</td>
<td><asp:textbox id= "txt1" runat= "Server" ></td>
</tr>
<tr>
<td> Password:</td>
<td><asp:textbox id= "txt2" textmode= "password" runat= "Server" ></td>
</tr>
<tr>
<td></td>
<td><asp:linkbutton text= "Landing" onclick= "Myonclick" runat= "Server" ></td>
</tr>
</table>
</body>
<script language= "C #" runat= "Server" >
public string username{
Get{return txt1. Text;}
Set{txt1. Text=value;}
}
public string password{
Get{return txt2. Text;}
Set{txt2. Text=value;}
}
public event Eventhandler Login; Add Event handle
void Myonclick (Object Sender,eventargs e) {
if (Login!= null)
Login (This,new EventArgs ()); Activate Login Event
}
</script>
To use custom events in an ASPX page:
<% @Register tagprefix= "Wen" tagname= "userevent" src= "Userlogin.ascx"%>
<body>
<form runat=server>
<wen:userevent id= "MyLogin" onlogin= "onloginpress" runat= "Server" >
</form>
<asp:label id= "LAB1" runat= "Server"/><br>
<asp:label id= "LAB2" runat= "Server"/><br>
</body>
<script language= "C #" runat= "Server" >
void Onloginpress (Object Render, EventArgs e) {
Lab1.text=mylogin.username;
Lab2.text=mylogin.password;
}
</script>
Description: The Onlogin event here is the event we added to the user control Userlogin.ascx file.