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
-
On the File menu, point to New, and then click Project.
The New Project dialog box appears.
-
In the Project Types pane, choose either Visual Basic Projects or Visual C# Projects. Select Web Control Library in the Templates pane.
-
Change the Name to CompositePalindromeControl and click OK.
The new project is created, and CompositePalindromeControl opens in the Code Editor.
-
Edit the code to change the derivation from WebControl to CompositeControl.
public
class
ServerControl1 : WebControl
Change this to
public
class
ServerControl1 : CompositeControl
-
Also implement INamingContainer. This interface is useful for managing unique ids for control’s children.
Code will look like
public
class
ServerControl1 : CompositeControl ,INamingContainer
-
Add the PalindromeFound event like below.
public
event
EventHandler PalindromeFound;
-
Add four member variables – a TextBox, a Button, a Label and a LiteralControl. Code would look like below.
public
event
EventHandler PalindromeFound;
protected
TextBox textboxPalindrome;
protected
Button buttonCheckForPalindrome;
protected
LiteralControl literalcontrolPalindromeStatus;
protected
Label labelForTextBox;
-
Write a method alphanumeric .
protected
string alphanumeric(string str)
{
string strTemp = (String)str.Clone();
if (str != null)
{
char[] var = strTemp.ToCharArray();
int i = 0;
foreach (char c in var)
{
if (char.IsLetterOrDigit(c))
{
i++;
}
else
{
strTemp = strTemp.Remove(i, 1);
}
}
}
return strTemp;
}
-
Write a Method checkForPalindrome
protected
bool checkForPalindrome()
{
if (this.Text != null)
{
String strControlText = this.Text;
String strTextToUpper = null;
strTextToUpper = Text.ToUpper();
strControlText = this.alphanumeric(strTextToUpper);
char[] rgcReverse = strControlText.ToCharArray();
Array.Reverse(rgcReverse);
String strReverse = new
String(rgcReverse);
if (strControlText == strReverse)
{
return
true;
}
else
{
return
false;
}
}
else
{
return
false;
}
}
-
Add and EventHandler OnCheckPalindrome to be applied on Button. Button will get added soon.
public
void OnCheckPalindrome(Object o, System.EventArgs e)
{
this.Text = this.textboxPalindrome.Text;
this.checkForPalindrome();
}
-
Now override the CreateChildControl method
protected
override
void CreateChildControls()
{
//base.CreateChildControls();
labelForTextBox = new
Label();
labelForTextBox.Text = “Enter a Palindrome”;
this.Controls.Add(labelForTextBox);
textboxPalindrome = new
TextBox();
this.Controls.Add(textboxPalindrome);
Controls.Add(new
LiteralControl(“<br/>”));
buttonCheckForPalindrome = new
Button();
buttonCheckForPalindrome.Text = ” Click For Palindrome”;
buttonCheckForPalindrome.Click+=new
EventHandler(OnCheckPalindrome);
this.Controls.Add(buttonCheckForPalindrome);
Controls.Add(new
LiteralControl(“<br/>”));
this.tablePalindromes = new
Table();
this.Controls.Add(tablePalindromes);
this.ChildControlsCreated = true;
}
In above code , if a comilation error is coming at the time of building of Project. Do not wory . tablePalindromes is yet to be add in the class. For bravity don’t try to build project by this step. Wait for few more steps.
-
Now to Show the palindrome status whenever Text property is se. so need to modify the Text Property.
First comment out default property line as follows
namespace CompositePalindromeControl
{
//[DefaultProperty(“Text”)]
Then, declare a private string varibale text. Then write property of text as follows .
private
String text;
public
string Text
{
get
{
return text;
}
set
{
text = value;
if (this.checkForPalindrome())
{
if (PalindromeFound != null)
{
PalindromeFound(this, EventArgs.Empty);
}
literalcontrolPalindromeStatus.Text = String.Format(“This is a Palindrome <br/> <Font size=\”5\” color=\”blue\”></b>{0}</b></font>”, text);
}
else
{
literalcontrolPalindromeStatus.Text = String.Format(“This is not a Palindrome <br/> <Font size=\”5\” color=\”red\”></b>{0}</b></font>”, text);
}
}
}
-
Add namespace System.Collection and declare two varibale as
protected
Table tablePalindromes;
protected
ArrayList alPalindromes;
-
Add a Method BuildPalindromesTable to build a palindrome table based on the content of the ArrayList.
protected
void BuildPalindromesTable()
{
this.alPalindromes = (ArrayList)this.ViewState[“palindromes”];
if (this.alPalindromes != null)
{
foreach (string s in
this.alPalindromes)
{
TableCell tablecell = new
TableCell();
tablecell.BorderStyle = BorderStyle.Double;
tablecell.BorderWidth = 3;
tablecell.Text = s;
TableRow tablerow = new
TableRow();
tablerow.Cells.Add(tablecell);
this.tablePalindromes.Rows.Add(tablerow);
}
}
}
-
Update the text property setter to manage the Table.
public
string Text
{
get
{
//String s = (String)ViewState[“Text”];
//return ((s == null) ? “[” + this.ID + “]” : s);
return text;
}
set
{
//ViewState[“Text”] = value;
text = value;
this.alPalindromes = (ArrayList)this.ViewState[“palindromes”];
if (this.alPalindromes == null)
{
this.alPalindromes = new
ArrayList();
}
if (this.checkForPalindrome())
{
if (PalindromeFound != null)
{
PalindromeFound(this, EventArgs.Empty);
}
alPalindromes.Add(text);
literalcontrolPalindromeStatus.Text = String.Format(“This is a Palindrome <br/> <Font size=\”5\” color=\”blue\”></b>{0}</b></font>”, text);
}
else
{
literalcontrolPalindromeStatus.Text = String.Format(“This is not a Palindrome <br/> <Font size=\”5\” color=\”red\”></b>{0}</b></font>”, text);
}
this.ViewState.Add(“palindromes”, alPalindromes);
this.BuildPalindromesTable();
}
}
Add yellow highlighted code in property Text.
-
Build the composite Server Control by
The Full code for CompositePalindromeControl 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.Collections;
namespace CompositePalindromeControl
{
//[DefaultProperty(“Text”)]
[ToolboxData(“<{0}:ServerControl1 runat=server></{0}:ServerControl1>”)]
public
class
ServerControl1 : CompositeControl ,INamingContainer
{
// [Bindable(true)]
// [Category(“Appearance”)]
// [DefaultValue(“”)]
// [Localizable(true)]
public
event
EventHandler PalindromeFound;
protected
TextBox textboxPalindrome;
protected
Button buttonCheckForPalindrome;
protected
LiteralControl literalcontrolPalindromeStatus;
protected
Label labelForTextBox;
protected
Table tablePalindromes;
protected
ArrayList alPalindromes;
private
String text;
public
string Text
{
get
{
//String s = (String)ViewState[“Text”];
//return ((s == null) ? “[” + this.ID + “]” : s);
return text;
}
set
{
//ViewState[“Text”] = value;
text = value;
this.alPalindromes = (ArrayList)this.ViewState[“palindromes”];
if (this.alPalindromes == null)
{
this.alPalindromes = new
ArrayList();
}
if (this.checkForPalindrome())
{
if (PalindromeFound != null)
{
PalindromeFound(this, EventArgs.Empty);
}
alPalindromes.Add(text);
literalcontrolPalindromeStatus.Text = String.Format(“This is a Palindrome <br/> <Font size=\”5\” color=\”blue\”></b>{0}</b></font>”, text);
}
else
{
literalcontrolPalindromeStatus.Text = String.Format(“This is not a Palindrome <br/> <Font size=\”5\” color=\”red\”></b>{0}</b></font>”, text);
}
this.ViewState.Add(“palindromes”, alPalindromes);
this.BuildPalindromesTable();
}
}
protected
override
void RenderContents(HtmlTextWriter output)
{
output.Write(Text);
}
protected
string alphanumeric(string str)
{
string strTemp = (String)str.Clone();
if (str != null)
{
char[] var = strTemp.ToCharArray();
int i = 0;
foreach (char c in var)
{
if (char.IsLetterOrDigit(c))
{
i++;
}
else
{
strTemp = strTemp.Remove(i, 1);
}
}
}
return strTemp;
}
protected
bool checkForPalindrome()
{
if (this.Text != null)
{
String strControlText = this.Text;
String strTextToUpper = null;
strTextToUpper = Text.ToUpper();
strControlText = this.alphanumeric(strTextToUpper);
char[] rgcReverse = strControlText.ToCharArray();
Array.Reverse(rgcReverse);
String strReverse = new
String(rgcReverse);
if (strControlText == strReverse)
{
return
true;
}
else
{
return
false;
}
}
else
{
return
false;
}
}
public
void OnCheckPalindrome(Object o, System.EventArgs e)
{
this.Text = this.textboxPalindrome.Text;
this.checkForPalindrome();
}
protected
override
void CreateChildControls()
{
//base.CreateChildControls();
labelForTextBox = new
Label();
labelForTextBox.Text = “Enter a Palindrome”;
this.Controls.Add(labelForTextBox);
textboxPalindrome = new
TextBox();
this.Controls.Add(textboxPalindrome);
Controls.Add(new
LiteralControl(“<br/>”));
buttonCheckForPalindrome = new
Button();
buttonCheckForPalindrome.Text = ” Click For Palindrome”;
buttonCheckForPalindrome.Click+=new
EventHandler(OnCheckPalindrome);
this.Controls.Add(buttonCheckForPalindrome);
Controls.Add(new
LiteralControl(“<br/>”));
this.tablePalindromes = new
Table();
this.Controls.Add(tablePalindromes);
this.ChildControlsCreated = true;
}
protected
void BuildPalindromesTable()
{
this.alPalindromes = (ArrayList)this.ViewState[“palindromes”];
if (this.alPalindromes != null)
{
foreach (string s in
this.alPalindromes)
{
TableCell tablecell = new
TableCell();
tablecell.BorderStyle = BorderStyle.Double;
tablecell.BorderWidth = 3;
tablecell.Text = s;
TableRow tablerow = new
TableRow();
tablerow.Cells.Add(tablecell);
this.tablePalindromes.Rows.Add(tablerow);
}
}
}
}
}
Step 2
Create a WebForm page to use CompositepalindromeControl server control
To create the Web Forms page
-
On the File menu, point to Add Project, and then click New Project.
The Add New Project dialog box appears.
-
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.
-
Click OK.
The new project is created, and WebForm1 opens in the designer.
- Save the project.
Step 3
Adding the control to the toolbox.
To add control to the toolbox
-
On the Tools menu, click Add/Remove Toolbox Items or Choose Tool Box Items.
- On the .NET Framework Components tab of the Customize ToolBox dialog box, click the Browse button. FindCustomPalindromeControl, select dll , and click Open to add ServerControl1 to the list of components in the Customize Toolbox dialog box.
-
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
-
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.
- 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”.
Thanks for reading J
Leave a Reply