How to create User Control in ASP.Net

User control is powerful functionality of ASP.NET. With the help of the user control you can reuse the Design as well as code in the application. Developing User control is similar to developing form in ASP.NET. User control is created in markup file with .ascx extension.

We create two user control one for collect the user information and second for Display the user information.

Step 1: Add the Web user control in your form with the name UserInformation.ascx and UserInformationGrid.ascx.

Step 2: Add the code in Userinformation.ascx

<table align="center">
<tr>
<td colspan="2">
<asp:Label ID="lblusername" runat="server" ForeColor="Red"></asp:Label>
</td>
</tr>
<tr>
<td>
UserName:
</td>
<td>
<asp:TextBox ID="txtusername" runat="server"></asp:TextBox><asp:RequiredFieldValidator
ID="RequiredFieldValidator1" runat="server"
ControlToValidate="txtusername">*</asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>

</td>
<td>
<asp:Button ID="btnSaveName" runat="server" Text="Save"
OnClick="btnSaveName_Click" style="height: 26px" />
</td>
</tr>
</table>

In Userinformation.ascx.cs file add the code like this.

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Linq;

public partial class UserControl_UserInformation : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
}
}
protected void btnSaveName_Click(object sender, EventArgs e)
{
InsertData();
Response.Redirect("~/Default.aspx");
}
private void InsertData()
{
Userinfo info = new Userinfo();
info.UserName = txtusername.Text.Trim();
using (UserInformationDataContext db = new UserInformationDataContext())
{
try
{
db.Userinfos.InsertOnSubmit(info);
db.SubmitChanges();
}
catch (Exception ex)
{
Response.Write("Error:" + ex.Message);
}
}
}
}

Step 3: Add the code in UserInformationGrid.ascx.

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="UserInformationGrid.ascx.cs" Inherits="UserControl_UserInformationGrid" %>

<asp:GridView ID="GridView1" runat="server" AllowPaging="True"
AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="UserName" HeaderText="UserName" />
</Columns>

</asp:GridView>