locked
How do you limit number of rows in a textbox? RRS feed

  • Question

  • User-703432812 posted

    I know there is a property called Rows and Multiline.  But the Rows property is only a display type property. It doesn't actually prevent the user from entering more than 4 lines if it is set to 4 Rows.

    Can anyone suggest a way of preventing the user from entering more than 4 lines of text in a textbox? 

    Wednesday, April 23, 2008 5:28 AM

Answers

  • User-1034726716 posted

    Validate the Max Length  limit instead.. see below for demo

    <script type="text/javascript" language="javascript">
       
         function validatelimit(obj, maxchar)
         {
       
            if(this.id) obj = this;
           
            var remaningChar = maxchar - obj.value.length;
            document.getElementById('<%= Label1.ClientID %>').innerHTML = remaningChar;

                if( remaningChar <= 0)
                {
                   obj.value = obj.value.substring(maxchar,0);
                   alert('Character Limit exceeds!');
                   return false;

                }
                else
                {return true;}
         }

        </script>

    <body  runat="server">
        <form id="form1" runat="server">

            <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" onkeyup="validatelimit(this,300)"></asp:TextBox>
            <asp:Label ID="Label1" runat="server" Text="0"></asp:Label>

       </form> 

    </body>

    300 is the MAX length of the characters in the TextBox..Just change the value of 300 based on your requirements..
     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, April 23, 2008 5:43 AM
  • User635636092 posted

    hi you can try this code with line and text length restrictions

     

     

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >

    <head runat="server">

    <title>Untitled Page</title>

     

    <script language="javascript">

     

     

    function ValidateLines(e, max,chrln)

    {

    var text = e.value.replace(/\s+$/g,"");

    var split = text.split("\n");

    if (split.length <= max && text.length <=chrln)

    {

    return true;

    }

    else if (split.length >= max || e.value.length >=chrln )

    {

    alert("stop lines!!!");

    return false;

    }

     

    }

    </script>

     

     

    </head>

    <body>

    <form id="form1" runat="server">

    <div>

    <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Rows="4" onkeypress="return ValidateLines(this,4,30)"/>

     

    </div>

    </form>

    </body>

    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, April 23, 2008 7:12 AM
  • User-1387544948 posted

    Hi there, well I found some javascript that works well, just ignore the onload part, and add a onkey="cleanUpList(this)" function to your text area.

    http://javascript.internet.com/forms/limit-textarea-2.html

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, April 24, 2008 11:17 AM
  • User-1387544948 posted

    1) Yes, didn't spot that one, as I am playing with it, there are other problems

     Not sure what you mean about the onclick ... try taking out the section of the script regarding function---below---

     function addLoadEvent(func) {
      var oldonload = window.onload;
      if (typeof window.onload != 'function') {
        window.onload = func;
      } else {
        window.onload = function() {
          if (oldonload) {
            oldonload();
          }
          func();
        }
      }
    }

    addLoadEvent(
      function () {
        document.amada.subjects.onkeyup = function () {
          cleanUpList(document.amada.subjects);
        }
      }
    );

    Another problem I found is that if you are using word wrap, the lines a re not counted, but all as 1 line, so you get halfway along the next line and it prevents entering anymore text, until you CR !

     I still looking for a solution to this, and have been for 2 days ! it is more of a javascript thing, than an ASP though....

     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, April 24, 2008 12:02 PM

All replies

  • User-1034726716 posted

    Validate the Max Length  limit instead.. see below for demo

    <script type="text/javascript" language="javascript">
       
         function validatelimit(obj, maxchar)
         {
       
            if(this.id) obj = this;
           
            var remaningChar = maxchar - obj.value.length;
            document.getElementById('<%= Label1.ClientID %>').innerHTML = remaningChar;

                if( remaningChar <= 0)
                {
                   obj.value = obj.value.substring(maxchar,0);
                   alert('Character Limit exceeds!');
                   return false;

                }
                else
                {return true;}
         }

        </script>

    <body  runat="server">
        <form id="form1" runat="server">

            <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" onkeyup="validatelimit(this,300)"></asp:TextBox>
            <asp:Label ID="Label1" runat="server" Text="0"></asp:Label>

       </form> 

    </body>

    300 is the MAX length of the characters in the TextBox..Just change the value of 300 based on your requirements..
     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, April 23, 2008 5:43 AM
  • User-703432812 posted

    Thanks for the code! However, isn't this just to check for a maximum length which can already be achieved using the MaxLength property?

    I need to prevent more than 4 lines being entered, effectively preventing more than 4 carriage returns in a textbox.  Shame this isn't already implemented as a property like MaxLines or something? 

     

    Wednesday, April 23, 2008 5:50 AM
  • User-1137493631 posted

    Hi Friend,

    you can use TextArea instead of textbox to achieve this

    kinldy see the sample inline code

    <textarea id="txttest" rows="10"></textarea>

    here the row indicats the number of rows.

     

    Wednesday, April 23, 2008 5:55 AM
  • User-1066334067 posted

    <textarea id="txttest" rows="10"></textarea>
     

    This just sets the number of rows being displayed, not the maximum number of rows that can be entered (this was mentioned in the OP).

    Wednesday, April 23, 2008 6:01 AM
  • User-1066334067 posted

    Here's a rough solution:

    function ValidateLines(e, max)
    {
    	var text = e.value.replace(/\s+$/g,"");	// trim trailing white-space characters if you only want to count lines with text in
    	var split = text.split("\n");
    	if (split.length > max)
    	{
    		alert("You've entered too many lines!!!");
    	}
    }
    And the textbox:
    <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Rows="4" onkeyup="ValidateLines(this,4)" />
    If you wanted I think you could also get the max number of rows from the Rows value in your textbox instead of passing it in as an argument, e.g.
    function ValidateLines(e)
    {
    var max = e.rows;
    var text = e.value.replace(/\s+$/g,""); // trim trailing white-space characters if you only want to count lines with text in
    var split = text.split("\n");
    if (split.length > max)
    {
    alert("You've entered too many lines!!!");
    }
    }
    Wednesday, April 23, 2008 6:16 AM
  • User635636092 posted

    hi you can try this code with line and text length restrictions

     

     

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >

    <head runat="server">

    <title>Untitled Page</title>

     

    <script language="javascript">

     

     

    function ValidateLines(e, max,chrln)

    {

    var text = e.value.replace(/\s+$/g,"");

    var split = text.split("\n");

    if (split.length <= max && text.length <=chrln)

    {

    return true;

    }

    else if (split.length >= max || e.value.length >=chrln )

    {

    alert("stop lines!!!");

    return false;

    }

     

    }

    </script>

     

     

    </head>

    <body>

    <form id="form1" runat="server">

    <div>

    <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Rows="4" onkeypress="return ValidateLines(this,4,30)"/>

     

    </div>

    </form>

    </body>

    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, April 23, 2008 7:12 AM
  • User-703432812 posted

    Hi,

    Good solutions thanks, but I'm wondering why the keypress still gets sent to the textbox even when it is over the maximum number of lines?

    Thursday, April 24, 2008 10:46 AM
  • User-1387544948 posted

    I have a similar requirement for this, also with the above solution, you can no longer edit any of the text ....

     

    Thanks guys

    Thursday, April 24, 2008 11:00 AM
  • User-1387544948 posted

    Hi there, well I found some javascript that works well, just ignore the onload part, and add a onkey="cleanUpList(this)" function to your text area.

    http://javascript.internet.com/forms/limit-textarea-2.html

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, April 24, 2008 11:17 AM
  • User-703432812 posted

    Hi,

    That is a better solution, but I noticed 2 things:

    1) how come if you just enter CRs and no text it doens't pick up on the maximum lines?
    2) one of my buttons doesn't seem to respond, no OnClick fired, whereas another button does fire??


     

    Thursday, April 24, 2008 11:45 AM
  • User-1387544948 posted

    1) Yes, didn't spot that one, as I am playing with it, there are other problems

     Not sure what you mean about the onclick ... try taking out the section of the script regarding function---below---

     function addLoadEvent(func) {
      var oldonload = window.onload;
      if (typeof window.onload != 'function') {
        window.onload = func;
      } else {
        window.onload = function() {
          if (oldonload) {
            oldonload();
          }
          func();
        }
      }
    }

    addLoadEvent(
      function () {
        document.amada.subjects.onkeyup = function () {
          cleanUpList(document.amada.subjects);
        }
      }
    );

    Another problem I found is that if you are using word wrap, the lines a re not counted, but all as 1 line, so you get halfway along the next line and it prevents entering anymore text, until you CR !

     I still looking for a solution to this, and have been for 2 days ! it is more of a javascript thing, than an ASP though....

     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, April 24, 2008 12:02 PM
  • User-703432812 posted

     Ok, give me an update if you can when you find a better solution. I'll try and investigate too...

    Monday, April 28, 2008 4:34 AM
  • User1866114635 posted

    Hokies had the same problem with this with text box trying to pass to flash where the text apears for a print label. Managed to find a solution to this one let me know if it works for you ;)

    <script type="text/javascript">
    var alert_title='Input Restriction';
    function limitTextarea(textarea,maxLines,maxChar)
    {
    var lines=textarea.value.replace(/\r/g,'').split('\n'),
    lines_removed,
    char_removed,
    i;
    if(maxLines&&lines.length>maxLines)
    {
    alert('You can not enter\nmore than '+maxLines+' lines');
    lines=lines.slice(0,maxLines);
    lines_removed=1
    }
    if(maxChar)
    {
    i=lines.length;
    while(i-->0)if(lines[i].length>maxChar)
    {
    lines[i]=lines[i].slice(0,maxChar);
    char_removed=1
    }
    if(char_removed)
    {
    alert('You can not enter more\nthan '+maxChar+' characters per line')
    }
    if(char_removed||lines_removed)
    {
    textarea.value=lines.join('\n')
    }
    function watchTextarea()
    {
    document.getElementById('resticted').onkeyup()
    }
    function set_ie_alert()
    {
    window.alert=function(msg_str)
    {
    vb_alert(msg_str)
    }
    }
    }
    }
    </script>

    <textarea onkeyup="limitTextarea(this,6,40) onfocus="focus_watch=setInterval('watchTextarea()',250)" onblur="clearInterval(focus_watch)">some text</textarea>

    Hokies sorry about the messy code and you will have to remove the alerts as they are tackey and you wouldnt want your user to see them i just used them for testing purposes.

     Hope this helps

    joe

    Friday, October 31, 2008 6:02 AM