Creating ASP.Net Server Control


 

The Web Control Library is not available in standard edition of Visual studio.

Step 1: Creating the Server Control.

The first step is to start a new project with the custom control template and build the control.

To create the custom control

  1. On the File menu, point to New, and then click Project. The New Project dialog box appears.

     
  2. In the Project Types pane, choose either Visual Basic Projects or Visual C# Projects. Select Web Control Library in the Templates pane. 



     
  3. Change the Name to aTextBox and click OK.

    The new project is created, and WebCustomControl1 opens in the Code Editor.

    Code for a custom Label control is included in the Web Control Library template by default. We can add custom code here.  

    In this code , we are creating a textbox which will accept only integer as input. If user will try to input other than integer , back color of TextBox will get black and forcolor will be red. User will get a message “Input integer Dude”.

    Add reference System.Drawing

    The full code is as follows
                 
     

    using System;

    using System.Collections.Generic;

    using System.ComponentModel;

    using System.Linq;

    using System.Text;

    using System.Web;

    using System.Web.UI;

    using System.Web.UI.WebControls;

    using System.Drawing;

     

    namespace aTextBox

    {

        [DefaultProperty("Text")]

        [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1>")]

        public class aNumericTextBox : TextBox

        {

            [Bindable(true)]

            [Category("Appearance")]

            [DefaultValue("")]

            [Localizable(true)]

            public override  string Text

            {

                get

                {

                    String s = (String)ViewState["Text"];

                    return ((s == null) ? String.Empty  : s);

                }

     

                set

                {

                   // ViewState["Text"] = value;

                    int i = 0;

                    if (int.TryParse(base.Text, out i))

                    {

                        base.BackColor = Color.White;

                        ViewState["Text"] = value;

                    }

                    else

                    {

                        base.Text=" Only Integer dude ";

                        base.BackColor=Color.Black;

                        base.ForeColor= Color.Red;

                    }

                }

            }

     

            protected override void RenderContents(HtmlTextWriter output)

            {

                output.Write(Text);

            }

        }

    }

     
  4. On the Build menu, click Build aTextBox  to compile the control.

    The control is compiled as aNumericTextBox.dll. By default, it is created in the Bin folder inside the aTextBox project folder.

     
  5. Save the file.

Step 2: Create a WebForm page to use aTextBox server control

  1. On the File menu, point to Add Project, and then click New Project. The Add New Project dialog box appears.

     
  2. In the Project Types pane, choose either Visual Basic Projects or Visual C# Projects. Select ASP.NET Web Application in the Templates pane.  Give any name for web application. Here name is TestingaTextBox. 



     
  3. Click OK. The new project is created, and WebForm1 opens in the designer.

     
  4. Save the project.

Step 3: Adding the control to the toolbox.

  1. On the Tools menu, click Add/Remove Toolbox Items or Choose Tool Box Items.



     
  2. On the .NET Framework Components tab of the Customize ToolBox dialog box, click the Browse button. Find CustomLabel.dll, select it, and click Open to add WebCustomControl1 to the list of components in the Customize Toolbox dialog box. 

     
  3. Select ServerControl1 in the list of .NET Framework components and click OK. ServerControl1 is added to the Toolbox.

To add the control to the Web Forms page and test it

  1. Open WebForm1 in Design view and drag ServerControl1 from the Toolbox to the page.

    The control's default rendering, which is simply the name of the control followed by its ID, appears in the Design view. 

     
  2. Switch to HTML view, and verify that an @ Register directive for the control's assembly is added to the page's HTML, with TagPrefix "cc1". 

     
  3. Set the Text property of the control to Hello.

    The control's appearance in Design view is updated to show the new text.

Up Next
    Ebook Download
    View all
    Learn
    View all