Wednesday, 4 April 2012

Using Asp.Net User Control

To use Asp.Net User Control, you should follow the following steps:

1. Create a user control in your project, user control has .ascx extension and give it a name, here I have a user control named AddressUC.ascx

2. Add controls that you want the user control to display, For eg:


3. Add code for the tasks that the user control will perform, and create properties in the control if you want to be able to share information between the user control and the hosting page. For eg:

public partial class AddressUC : System.Web.UI.UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {
            
    }

    public class AddressEventAgrs : EventArgs
    {
        public AddressEventAgrs(string addressLine1, string addressLine2, string city, string state, string zip)
        {
            this.AddressLine1 = addressLine1;
            this.AddressLine2 = addressLine2;
            this.City = city;
            this.State = state;
            this.Zip = zip;
        }
        public string AddressLine1 { get; private set; }
        public string AddressLine2 { get; private set; }
        public string City { get; private set; }
        public string State { get; private set; }
        public string Zip { get; private set; }
    }

    public delegate void SaveButtonClickHandler(object sender, AddressEventAgrs e);
    public event SaveButtonClickHandler SaveButtonClick;

    //function to display a message to user
    private void MessageBox(string msg)
    {
        Label lbl = new Label();
        lbl.Font.Bold = true;
        lbl.Text = "";
        Page.Controls.Add(lbl);
    }

    //code for SAVE button click
    protected void ButtonSave_Click(object sender, EventArgs e)
    {
        if (SaveButtonClick != null)
        {
            SaveButtonClick(this, new AddressEventAgrs(txtAddressLine1.Text, txtAddressLine2.Text, txtCity.Text, txtState.Text, txtZip.Text));
        }
        if (txtAddressLine1.Text == string.Empty & txtCity.Text == string.Empty & txtState.Text == string.Empty & txtZip.Text == string.Empty)
        {
            MessageBox("Please enter all the information !");
        }
        else
        {
            MessageBox("You entered following information \\n\\nAddress: " + txtAddressLine1.Text + " "+txtAddressLine2.Text + "\\nCity: " + txtCity.Text + "\\nState: " + txtState.Text + "\\nZip: " + txtZip.Text);
        }
    }
}

4. Create an aspx page on which you want to use the user control, I have an aspx page named UserControl.aspx

5. Create an @Register directive on UserControl.aspx page that includes:


6. Add following code to UserControl.aspx page

public partial class UserControl : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Control form = Page.FindControl("Form1");
        AddressUC uc = (AddressUC)LoadControl("AddressUC.ascx");
        form.Controls.Add(uc); 
    }
}

7.When you will run your UserControl.aspx page you will get something like:



No comments:

Post a Comment