Max Length not working for Multi Line Text Box : Solution

In almost all the web projects, we require a multiline TextBox control. It was annoying to find that maxLength property doesn't work on multiline textboxes. There is a workaround to accomplish this using RegularExpressionValidator. Following is the markup that will restrict the text box to maximum of 500 characters.

?

1 2 3 4

<asp:textbox height="100px" id="txtComments" maxlength="10" runat="server" textmode="MultiLine" width="320px"></asp:textbox>    <asp:regularexpressionvalidator controltovalidate="txtComments" errormessage="Maximum 500 characters are allowed in comments box." id="regComments" runat="server" text="Maximum 500 characters are allowed in comments box." validationexpression="^[\s\S]{0,500}$"> </asp:regularexpressionvalidator>

OR You it can be done so easily using javascript functions.



I suggest that we should put a javascript validator function so that user will not be able to enter characters more than the length specified, even cant paste any text with more than specified characters. Here are those javascript functions.



TextBox Control

?

1 2

<asp:textbox height="168px" id="txtBox" maxlength="2000" onbeforepaste="doBeforePaste(this);" onkeypress="doKeypress(this);" onpaste="doPaste(this);" runat="server" textmode="MultiLine" width="223px">                                                                                                                                                                                                                                                                          </asp:textbox>

Javascript:

?

1 2 3 4 5 6 7 8 9 10

// Keep user from entering more than maxLength characters   function doKeypress(control){     maxLength = control.attributes["maxLength"].value;     value = control.value;      if(maxLength && value.length > maxLength-1){           event.returnValue = false;           maxLength = parseInt(maxLength);      } }

?

1 2 3 4 5 6 7 8 9

// Cancel default behavior   function doBeforePaste(control){     maxLength = control.attributes["maxLength"].value;      if(maxLength)      {           event.returnValue = false;      } }

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

// Cancel default behavior and create a new paste routine   function doPaste(control){     maxLength = control.attributes["maxLength"].value;     value = control.value;      if(maxLength){           event.returnValue = false;           maxLength = parseInt(maxLength);           var oTR = control.document.selection.createRange();           var iInsertLength = maxLength - value.length + oTR.text.length;           var sData = window.clipboardData.getData("Text").substr(0,iInsertLength);           oTR.text = sData;      } }

One additional thing you have to do is to add maxLength property of text box on Server side Page Load.

?

1 2 3 4 5

protected void Page_Load(object sender, EventArgs e)     { txtBox.Attributes.Add("maxLength", txtBox.MaxLength.ToString());              }

Hope this will help you.