Home     About PeterBlum.com     Policies     Download a Licensed Product     Newsletter
Peter's Interactive Pages
TextCounter Control

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.

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" />