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 control1. 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 CompositePalindromeControl and click OK. The new project is created, and CompositePalindromeControl opens in the Code Editor.
4. Edit the code to change the derivation from WebControl to CompositeControl.
{codecitation class="brush: csharp; gutter: true;" width="650px"}
public class ServerControl1 : WebControl
{/codecitation} Change this to {codecitation class="brush: csharp; gutter: true;" width="650px"} public class ServerControl1 : CompositeControl {/codecitation}
5. Also implement INamingContainer. This interface is useful for managing unique ids for control’s children. Code will look like
{codecitation class="brush: csharp; gutter: true;" width="650px"}
public class ServerControl1 : CompositeControl ,INamingContainer
{/codecitation}
6. Add the PalindromeFound event like below.
{codecitation class="brush: csharp; gutter: true;" width="650px"}
public event EventHandler PalindromeFound; {/codecitation}
7. Add four member variables – a TextBox, a Button, a Label and a LiteralControl. Code would look like below. {codecitation class="brush: csharp; gutter: true;" width="650px"}
public event EventHandler PalindromeFound; protected TextBox textboxPalindrome; protected Button buttonCheckForPalindrome; protected LiteralControl literalcontrolPalindromeStatus; protected Label labelForTextBox;
{/codecitation}
8. Write a method alphanumeric . {codecitation class="brush: csharp; gutter: true;" width="650px"}
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; }
{/codecitation} 9. Write a Method checkForPalindrome
{codecitation class="brush: csharp; gutter: true;" width="650px"}
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; } }
{/codecitation} 10. Add and EventHandler OnCheckPalindrome to be applied on Button. Button will get added soon.
{codecitation class="brush: csharp; gutter: true;" width="650px"}
public void OnCheckPalindrome(Object o, System.EventArgs e) { this.Text = this.textboxPalindrome.Text; this.checkForPalindrome(); }
{/codecitation} 11. Now override the CreateChildControl method
{codecitation class="brush: csharp; gutter: true;" width="650px"}
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; }
{/codecitation} 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. 12. 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
{codecitation class="brush: csharp; gutter: true;" width="650px"}
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); } } }
{/codecitation} 13. Add namespace System.Collection and declare two varibale as
{codecitation class="brush: csharp; gutter: true;" width="650px"} protected Table tablePalindromes; protected ArrayList alPalindromes;
{/codecitation}
14. Add a Method BuildPalindromesTable to build a palindrome table based on the content of the ArrayList.
{codecitation class="brush: csharp; gutter: true;" width="650px"}
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);
} } } {/codecitation}
15. Update the text property setter to manage the Table.
{codecitation class="brush: csharp; gutter: true;" width="650px"}
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(); } }
{/codecitation}
Add yellow highlighted code in property Text. 16. Build the composite Server Control by The Full code for CompositePalindromeControl is as follows {codecitation class="brush: csharp; gutter: true;" width="700px"}
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);
} } } } }
{/codecitation}
Step-2 Create a WebForm page to use CompositepalindromeControl server control To create the Web Forms page1. 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.
To add control to the toolbox1. 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. FindCustomPalindromeControl, select dll , and click Open to add ServerControl1 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 it1. 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". Thank you
| About the Author |
 | | Dhananjay Kumar | Description :I done my engineering from Anand Engineering college Agra in 2007. I am MCTS WCF, MCTS MOSS Development, I am MCTS Web Development . I am native of Jamshedpur. Currently Please feel free to contact me regarding any clarification of my article at Dhananjay.25july@gmail.com
Occupation : Software Engineer Company : UST Global. Location : India Follow me at twitter : http://twitter.com/dhananjay25
|
|
|