Monday, 25 March 2013

User control in asp.net with Example


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 MyControl.ascx ( .ascx is extension for user-control)

ASCX code :

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MyControl.ascx.cs" Inherits="UserControlDemo.MyControl" %>

<asp:TextBox ID="textNumber" runat="server" 
    ReadOnly="True" Width="32px" Enabled="False" />
<asp:Button Font-Bold="True" ID="buttonUp" runat="server"  
    Text="^" OnClick="buttonUp_Click" />
<asp:Button Font-Bold="True" ID="buttonDown" runat="server" 
    Text="v" OnClick="buttonDown_Click" />


ASCX.CS code (code behind of user-control page)

  public partial class MyControl : System.Web.UI.UserControl
    {        
        private int m_minValue;
        private int m_maxValue = 100;
        private int m_currentNumber = 0;
        public int MinValue
        {
            get
            {
                return m_minValue;
            }
            set
            {
                if (value >= this.MaxValue)
                {
                    throw new Exception("MinValue must be less than MaxValue.");
                }
                else
                {
                    m_minValue = value;
                }
            }
        }
        public int MaxValue
        {
            get
            {
                return m_maxValue;
            }
            set
            {
                if (value <= this.MinValue)
                {
                    throw new
                        Exception("MaxValue must be greater than MinValue.");
                }
                else
                {
                    m_maxValue = value;
                }
            }
        }
        public int CurrentNumber
        {
            get
            {
                return m_currentNumber;
            }
        }
        protected void Page_Load(Object sender, EventArgs e)
        {
            if (IsPostBack)
            {
                m_currentNumber =
                    Int16.Parse(ViewState["currentNumber"].ToString());
            }
            else
            {
                m_currentNumber = this.MinValue;
            }
            DisplayNumber();
        }
        protected void DisplayNumber()
        {
            textNumber.Text = this.CurrentNumber.ToString();
            ViewState["currentNumber"] = this.CurrentNumber.ToString();
        }
        protected void buttonUp_Click(Object sender, EventArgs e)
        {
            if (m_currentNumber == this.MaxValue)
            {
                m_currentNumber = this.MinValue;
            }
            else
            {
                m_currentNumber += 1;
            }
            DisplayNumber();
        }
        protected void buttonDown_Click(Object sender, EventArgs e)
        {
            if (m_currentNumber == this.MinValue)
            {
                m_currentNumber = this.MaxValue;
            }
            else
            {
                m_currentNumber -= 1;
            }
            DisplayNumber();
        }
    }


ASPX Page


<%@ Register TagName="My" Src="~/MyControl.ascx" TagPrefix="Mycc" %>

(Declare Above line which include ascx src file and tag prefix )

<!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></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" AllowPaging="true" 
            DataSourceID="SqlDataSource1">
            <Columns>
                <asp:BoundField DataField="Line_No" HeaderText="Line_No" 
                    SortExpression="Line_No" />
                <asp:BoundField DataField="Description" HeaderText="Description" 
                    SortExpression="Description" />
            </Columns>
        </asp:GridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
            ConnectionString="<%$ ConnectionStrings:XYZ %>" 
            SelectCommand="SELECT [Line_No], [Description] FROM [Temp_Line]">
        </asp:SqlDataSource>
      
      <Mycc:My ID="Value" runat="server" MaxValue="10" MinValue ="0" />
    </div>
    </form>
</body>
</html>



Enjoy..check output..... 




No comments:

Post a Comment