Reader Level:
ARTICLE

Create Custom Web Control in ASP. NET

Posted by Sapna Articles | Custom Controls C# October 17, 2011
Here we are going to create a required Textbox field custom web control in ASP.NET.
  • 3
  • 0
  • 54243

Introduction:

Now we are going to discuss about how to create a custom web control in ASP.NET. How do we create and use them in ASP.NET web site application? As we know, a custom control is a control made by the user for a specific purpose and later we can use it in our application. In this article we are going to see how we can create and implement a custom web control. Now we are going to make a required valid Textbox value which checks that the Text box has the value or not, if not then it will give an error that it cannot not be empty. This web control will inherit from the Textbox web control, and will automatically add a required field validator at run-time. We will just define an Instance of the required field validator.

Let see how we create and use it:

Step 1: Now create a web server control application

  • First go to File->New->Project->ASP.NET Server Control

  • Name it as Valid Text box

takeservercontrol_app.gif

Step 2: Code of the Class to validate the Textbox's Text

Code :
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;
namespace ValidTextBox
{
  [DefaultProperty("ch")]
  [ToolboxData("<{0}:ValidTextBox1 runat=server></{0}:ValidTextBox1>")]
public class ValidTextBox1 : TextBox
 {
   [Bindable(true)]
   [Category("Appearance")]
   [DefaultValue("")]
   [Localizable(true)]
public  string ch
 {
   get
    {
     String s = (String)ViewState["ch"];
     return ((s == null) ? "[" + this.ID + "]" : s);
    }
   set
    {
     ViewState["ch"] = value;
    }
  }
   private RequiredFieldValidator rfv;
   public string NotValid;
   public string C_Script = "true";

protected override void On_Init(EventArgs e)
    {
      rfv = new RequiredFieldValidator();
      rfv.ControlToValidate = this.ID;
      rfv.ErrorMessage = this.NotValid;
      rfv.EnableClientScript = (this.C_Script.ToLower() != "false");
      Controls.Add(rfv);
    }
protected override void RenderContents(HtmlTextWriter op)
  {
   op.Write(ch);
   base.RenderContents(op);
   rfv.RenderControl(op);
  }
 }
}

Code Description : Here we are using a class name ValidTextBox1 which inherits from the Textbox Class. In this class we have to make some methods like On_init()  which shows how we create a instance of required field validator control. Now we see that the [DefaultProperty("ch")] which specify default attribute of the Control. Now we have to make the two property name as Not Valid and C_Script which are public and used to validate the text in the Text box and shows the script will be true. The [ToolboxData]  specifies the format string for the element. The string becomes the control's markup when the control is double-clicked in the toolbox or dragged from the toolbox onto the design surface.

Step 3: Now we have to add a namespace and an assembly information to the AssemblyInfo.cs file.

  • Firstly you have to add a namespace at the top of the page named as System.Web.UI.

  • Secondly you have to write an assembly at the end of the page given below.

 [assembly: TagPrefix("ValidTextBox","asp Sample")].

after_step-3.gif

Step 4: Now you have to build the project it will be build succeeded.

Step 5: Now open new file and project name it ASP.NET Website

after_step_5.gif

Step 6: Click Ok.

  • Now Right click on Solution Explorer and add Existing project

  • Now Right click on the Website project and add a reference

after_step_6.gif

Step 7: Now you will add a control to the Toolbox.

  • Go to the Toolbox

  • Right click on any Toolbox control and select Choose item

  • it will show a window with .NET Component

  • Add a component name as ValidTextBox1 it will look like below.

after_step7.gif

Step 8: Now The Control will appear in the Toolbox as seen in the figure given below.

after_step_8.gif

Step 9: Now drag and drop the Custom control to the .aspx page and run it.

Output :

output.gif

COMMENT USING

Trending up