The TextCounter control displays the number of characters or words within a textbox. It assists users when there are limits to the size of text they can enter. It compliments, but does not replace the TextLengthValidator/WordCountValidator, because it does not impose a limit. It merely communicates the count and if a limit is exceeded.

Here are its features:

• Evaluates the size of the text as compared to a maximum and possibly a minimum.
• Evaluates either the number of characters or the number of words.
• Its text and optionally style sheet changes as the text size changes:
  
  
  • Below the minimum
  • Between the minimum and the next milestone
  • At or above a milestone prior to the maximum, such as 20 characters left
  • At or above a second milestone prior to the maximum, such as 10 characters left, to allow further emphasis that the user is reaching the maximum
  • Above the maximum
  See Demo 2.
• The text shown supports tokens that can be replaced by the current count, minimum, maximum, and how much it exceeds the maximum.
• It can be shown on the page like a label and/or in the Interactive Hints feature. When in a Hint, it is hidden except when focus is on the textbox. (See Demo 3)

Demo 1 - Counting without limits

Character count:

ASP.NET Syntax for this demo

<asp:TextBox id="TextBox1" runat="server" Width="400px" TextMode="MultiLine" Rows="5" />
Character count:
<des:TextCounter id="TextCounter1" runat="server" TextBoxControlID="TextBox1" />;

Demo 2: Counting with minimum and maximum limits

Limits used here are a minimum of 5 and maximum of 20. The limits are established on the TextLengthValidator.

Exceeds the character limit of 5 to 20 by 0.

Character count:

ASP.NET Syntax for this demo

<asp:TextBox ID="TextBox2" runat="server" Width="400px" TextMode="MultiLine" Rows="5" />
<des:TextLengthValidator ID="Textlengthvalidator2" runat="server" ControlIDToEvaluate="TextBox2"
   ErrorMessage="Exceeds the character limit of {MINIMUM} to {MAXIMUM} by {EXCEEDS}."
   Minimum="5" Maximum="20" />
Character count:
<des:TextCounter ID="TextCounter2" runat="server" TextBoxControlID="TextBox2" Milestone2="5" />

Demo 3: TextCounter in a Hint

The DES Enhanced TextBox is used to provide the hint feature.

ASP.NET Syntax for this demo

<des:TextBox ID="TextBox3" runat="server" Width="400px" TextMode="MultiLine" Rows="5" />
<des:TextCounter ID="TextCounter3" runat="server" TextBoxControlID="TextBox3" DisplayMode="Hint" />