ASP.NET Server Controls Tutorial

In this tutorial, you will learn how to build an ASP.NET server control by creating a Hello World Control. Along the way, we'll review the fundamental process of server control development from scratch.

Creating a Custom Control Project

First, we need to create a new class library project to hold our custom controls. By creating the custom control in a separate class library, we can compile the project into a separate DLL and use the custom control in any application that requires it.

Open your ASP.NET project with Visual Studio or Visual Web Developer. In Solution Explorer, right click the solution name, and select Add New Project from the context menu. In the Add New Project dialog box, choose the project type to be a Web project, and select ASP.NET Server Control as the template, like so:

Name the project CustomControls. Click OK. The new ASP.NET Server Control project is created, and Visual Studio also provides you with a simple Web control to start with. Delete this custom control because we don't need it.

After adding the of project you can see ServerControl1.cs file along with default property Text.


using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace HelloWorldServerControl
{
    [DefaultProperty("Text")]
    [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1>")]
    public class ServerControl1 : WebControl
    {
        [Bindable(true)]
        [Category("Appearance")]
        [DefaultValue("Hello World")]
        [Localizable(true)]
        public string Text
        {
            get
            {
                String s = (String)ViewState["Text"];
                return ((s == null)? "[" + this.ID + "]" : s);
            }

            set
            {
                ViewState["Text"] = value;
            }
        }

        protected override void RenderContents(HtmlTextWriter output)
        {
            output.Write(Text);
        }
    }
}

What is RenderContent ? 

The primary job of a server control is to render some type of markup language to the HTTP output stream, which is returned to and displayed by the client. It is our responsibility as the control developer to tell the server control what markup to render. The overridden RenderContents method is the primary location where we tell the control what we want to render to the client.

Notice that the RenderContents method has one method parameter called output. This parameter is an HtmlTextWriter object, which is what the control uses to render HTML to the client. The HtmlTextwriter class has a number of methods you can use to render your HTML, including AddAttribute and RenderBeginTag.

Furthermore in RemderContent

Adding HelloWorld Control to the Visual Studio Toolbox

• Create a new WebForm Application
• To add the HelloWorld control to the Toolbox, right click in the Toolbox Explorer
• Choose Items from the context menu
• Click the Browse button in the Choose Toolbox Items dialog box
• Navigate to the ASP.NET project directory
• Go to the CustomControls directory
• Open the Bin\Debug directory (Visual Studio builds debug versions by default.)
• Select the CustomControls.DLL assembly and click on the Open button

Then will appear in the Choose Toolbox Items dialog box as shown in the image above.

Placing the HelloWorld Control on ASP.NET Web Page

To place the control on the page, switch to Design mode. Drag the ServerControl1 control from the Toolbox and drop it onto the Default.aspx design view.Then set the ServerControl1.Text Property.That's All.

Summary

In this tutorial, you learned how to create your own ASP.NET custom server control from scratch. You now know every step of the process - from how to create a web custom control library project, how to add properties to a custom control, how to render the HTML markup of the control to the client, and, finally, how to use the ASP.NET custom control in a web form.

Hopefully, you now have the skills to create custom controls that have all the functionality of the standard ASP.NET server-side controls. Thank you so much for reading!

Source & Extended Tutorials : http://code.tutsplus.com/articles/create-aspnet-server-controls-from-scratch--net-16867