January 23, 2011

Custom Composite Control

I want to create the login control as composite control in asp.net so it can be used between
multiple applications.

Below are the steps to create custom control in ASP.NET

1) Start Visual Studio and Select template a Webcontrol Library or ASP.NET server control project, and give it a name, for example,
CustomLoginControl.

2) Add a source file to the project, for example, LoginServerControl.cs.

3) Include the reference of the System.Web namespace in the references section.

4) Check whether the following namespaces are included in the LoginServerControl.cs file.

System
System.Collections
System.ComponentModel
System.Data
System.Web
System.Web.SessionState
System.Web.UI
System.Web.UI.WebControls

5) Add Properties /Methods /Events

6) Compile the project. It will generate the DLL output(in Project's Debug/bin folder ).

8) Open an existing or create a new ASP.NET Web application project.

9) Add a Web Forms page where the custom control can be used.

10) Add a reference to the class library in the references section of the ASP.NET project.

11) Register the custom control on the Web Forms page.

<% @ Register TagPrefix = "CC" Namespace = CustomLoginControl Assembly = CustomLoginControls" % >



12) To instantiate or use the custom control on the Web Forms page, add the following line of code in the
"FORM" tags.
CC:LoginServerControl id="ctlSimpleControl" runat="server"


13) Run the Web Forms page, and you will see the output from the custom control.


Below is the code

In CustomLogin Web Control Library

WebCustomControl1.cs
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomLogin
{
[DefaultEvent ("Click")]
[Category("Appearance")]
public class WebCustomControl1 : System.Web.UI.WebControls.WebControl ,INamingContainer
{
TextBox txtUserName = new TextBox();
RequiredFieldValidator rvUserName = new RequiredFieldValidator();
TextBox txtPassword = new TextBox();
RequiredFieldValidator rvPassword = new RequiredFieldValidator();
Button butLogin= new Button();
Label lblResult = new Label();

//private string text;

//Declare the event.
public event EventHandler Click ;


protected override void CreateChildControls()
{
// Add the sub controls to this composite control.
// Set the TextMode property and add textbox.
txtUserName.TextMode = TextBoxMode.SingleLine;
txtUserName.ID = "UserName";
Controls.Add(txtUserName);

rvUserName.ControlToValidate = txtUserName.ID;
rvUserName.ForeColor = System.Drawing.Color.Red;
rvUserName.SetFocusOnError = true;
rvUserName.ErrorMessage = "* Required";
Controls.Add(rvUserName);


// Start a new line
Controls.Add(new LiteralControl("
"));

txtPassword.TextMode = TextBoxMode.Password;
txtPassword.ID = "Password";
Controls.Add(txtPassword);


rvPassword.ControlToValidate = txtPassword.ID;
rvPassword.ForeColor = System.Drawing.Color.Red;
rvPassword.SetFocusOnError = true;
rvPassword.ErrorMessage = "* Required";
Controls.Add(rvPassword);




// Start a new line
Controls.Add(new LiteralControl("
"));
// Set the Text property and add the Button control.
butLogin.Text = "Login";
Controls.Add(butLogin);
// Add Label and Literals to display result.
Controls.Add(new LiteralControl("&nbsp&nbspResult:&nbsp"));
Controls.Add(lblResult);
Controls.Add(new LiteralControl(""));

// Add event handler.
butLogin.Click += new EventHandler(butLoginClicked);

}


protected virtual void OnClick(EventArgs e)
{
// Raise the event.
Click(this, e);
}

void butLoginClicked(object sender, EventArgs e)
{
// Call the event method.
// System.Web.HttpContext.Current.Response.Write("button was clicked");
AutheticateUser();//Authentication logic of the Application
OnClick(EventArgs.Empty);
}

public void AutheticateUser()//Just a trial Logic
{
if (txtUserName.Text == "Admin" && txtPassword.Text == "Admin")
{
lblResult.Text = "Successful Login";

}
else
{
lblResult.Text = "Username Password Combination doesn't match";

}

}
public string Text
{
get
{
String s = (String)ViewState["Text"];
return ((s == null) ? String.Empty : s);
}

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


Use the above control in WebApp on defaul.aspx
Add the following RegisterDirective

<%@ Register Assembly="CustomLogin" Namespace="CustomLogin" TagPrefix="CC" %>

Place The control in between "form" Tag
CC:WebCustomControl1 runat="server" ID="loginControl" OnClick="loginControl_Click" OnDisposed="loginControl_Disposed"

defaul.aspx.cs

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void loginControl_Click(object sender, EventArgs e)
{


Response.Write("Login clicked");
}
protected void loginControl_Disposed(object sender, EventArgs e)
{

}
}

2 comments:

  1. Have you ever tried to do what you have written here step-by-step?

    ReplyDelete
  2. Yes , off course , and that is why it is written here.

    ReplyDelete