Creating a Web User Control in C#

   Web User control or the .ascx file in asp .net is a replacement for the include file feature in ASP. It actually is a positive evolution from the asp model. Classic asp had used .inc file and included it wherever we needed it. Though this model is also similar, Web User Controls have a lot of other features added along with them.

   Web user controls are derived from System.Web.UI.UserControl namespace. These controls once created, can be added to the aspx page either at design time or programmatically during run time. But they lack the design time support of setting the properties created along with the control. They cannot run on their own and they need to stand on another platform like an aspx page. Even if we try to load it on a web browser, IIS will not serve the files of the type .ascx.

Creating a Web User Control:

  1. Create a new ASP .Net web application using Visual Studio .Net.
  2. Add a Web User Control to the project. Name it as SampleUserControl.ascx.
  3. Add a Panel Control on the user control form and name it as pnlSample.
  4. This Panel control is going to be used to hold our other controls.
  5. Add a TextBox as txtSearch and a Command button as cmdSearch. These will be used for entering a site search term and doing a search.
  6. Add a property to the User Control as follows.
    protected Color backColor;

    public Color BackColor
    {

    get
    {
    return backColor;
    }
    set
    {
    backColor = value;
    }

    }

  7. The above can be used set the Background color of the control. Add the following code to the Page_Load event of the control.
  8.  
    private void Page_Load(object sender, System.EventArgs e)
    {
       // Put user code to initialize the page here
       pnlSample.BackColor = backColor;
    }
  9. Now Add another web form as TestPage.aspx.
  10. Drag and drop the SampleUserControl.ascx into the Web form. This will put the following entries in the aspx page.
  11. <%@ Register TagPrefix="uc1" TagName="SampleUserControl" Src="SampleUserControl.ascx" %>. This code registers the control with the current aspx page.
  12. <uc1:SampleUserControl id="SampleUserControl1" runat="server"></uc1:SampleUserControl>. This entry will be found inside the <form> .. </form> tag.
  13. Build the application.
  14. Select and view the TestPage.aspx in the browser. This will show the aspx page with the control loaded with it.

   Now if we need we can change the background color to Gray, by adding the property in the control as follows.

 <uc1:SampleUserControl BackColor="Gray" id="SampleUserControl1" runat="server"></uc1:SampleUserControl>

   Now if the application is built, the testpage.aspx will show our user control with a gray background.

Advantages of a Web User Control:

   The biggest advantage of the Web User controls is that they can be created as a site template and used through out the site. For example they can be made to contain the Menu/Link structure of a site and can be used at all the other aspx pages. 

This means the following :

  1. If the website introduces a new site-wide link within the current layout/structure, it is enough if we put it on the user control once. All pages will be updated once if the web user control is used in them.
  2. If there is any link to be corrected, it can be done once at the server side.  
  3. The .ascx files can either be used as a simple alternative to the plain HTML or they can also be used to respond to events: This means even custom code can be created against them and put in the code behind files.

Drawbacks / Disadvantages:

   Though the User controls offer a flexibility of having a site wide modifications, if the whole structure of the site changes, the HTML/aspx code of all the pages should be modified. But as long as the site maintains a same layout, then Web User controls are the number one choice for maintaining the generic layout of the site.

   Another disadvantage is It can not be just be simply referenced for using in a different project. If we want to use this User Control in a different project, we have to copy the file and modify the namespace to the host namespace name.

Attachments: 

  Project Files : UserControlSample.zip

 

Close    To Top
  • Prev Article-Programming:
  • Next Article-Programming:
  • Now: Tutorial for Web and Software Design > Programming > dotnet > Programming Content
    Photoshop Tutorial
     

    Special Effect

      3D Effect
      Photoshop Articles
    Programming Tutorial
     

    C/C++ Tutorial

      Visual Basic
      C# Tutorial
    Database Tutorial
     

    MySQL Tutorial

      MS SQL Tutorial
      Oracle Tutorial
    Geek Tutorial
     

    Blogging Tutorial

      RSS Tutorial
      Podcasting Tutorial
    Graphic Design Tutorial
      Coreldraw Tutorial
      Illustrator Tutorial
      3D Tutorials
    Webmaster Articles
     

    Domain Service

      Web Hosting
      Site Promotion
    Java Tutorial/ Articles
     

    Java Servlets

      JavaEE Tutorial
     

    JavaBeans Tutorial

    XML Tutorial/ Articles
     

    XML Style

      AJAX Tutorial
      XML Mobile
    Flash Tutorial/ Articles
     

    Flash Video

      Action Script
      Flash Articles
    OS Tutorial/ Articles
      Linux Tutorial
      Symbian Tutorial
      MacOS Tutorial
    Personal Tech
      Hardware Tutorial
      Software Tutorial
      Online Auction