Saturday, October 02, 2010

MaxLength property not Working in TextBox

If you are involved in coding using .Net sooner or later you will notice that when the TextMode of a TextBox is changed to MultiLine the MaxLength property will stop working. What this means is in the textbox users will be able to type as many character as they want.

When searching the web for a fix for this I found several ideas to solve this. Following is the code which I modified for my requirement. Hope this helps.

ASPX





  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head runat="server">
  3. <script type="text/javascript">
  4.     function RestrictLength(textBox) {
  5.         /* Get the Max Length attribute's value. */
  6.         var allowedLength = textBox.getAttribute('MaximumLength');
  7.         /* Check for the number of characters typed in by the user. */
  8.         if (textBox.value.length > allowedLength) {
  9.             /* If it is more than the allowed limit remove the additional text. */
  10.             textBox.value = textBox.value.substring(0, allowedLength);
  11.             /*  Show a message to user with the tooltip used for the textbox. */
  12.             alert("Maximum characters allowed for '" + textBox.title +"' is " + allowedLength + ".");
  13.         }
  14.     }
  15. </script>
  16.     <title></title>
  17. </head>
  18. <body>
  19.     <form id="form1" runat="server" style="vertical-align:top;">
  20.     <!-- I am binding my java script to the onkeyup event of the textbox. So each time a key
  21.     is pressed it will fire my javascript. -->
  22.     Address <asp:TextBox ID="TextBox1" runat="server" MaxLength="10"
  23.         onkeyup="RestrictLength(this);" Height="58px" TextMode="MultiLine"></asp:TextBox>
  24.     </form>
  25.     </body>
  26. </html>




 

ASPX.CS





  1. protected void Page_Load(object sender, EventArgs e)
  2. {
  3.     // Adding the attribute to the TextBox1.
  4.     // Note that this is different to the MaxLength property.
  5.     // Also this is not case sensitive.
  6.     TextBox1.Attributes.Add("maximumlength", "10");
  7.     // Adding a tooltip which is used in the message.
  8.     TextBox1.ToolTip = "User Address";
  9. }




The output will me something similar to the following.

2 comments:

Anonymous said...

Hello. And Bye.

Alem said...

This helped me, Thanks.