How to limit the number of characters and lines in the textbox using javascript?

Question

<script type="text/javascript">
function checking(textarea, maxLines, maxChar) {
    var lines = textarea.value.replace(/\r/g, '').split('\n'), lines_removed, char_removed, i;
    if (maxLines && lines.length > maxLines) {
        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 || lines_removed) {
            textarea.value = lines.join('\n')
        }
    }
}
</script>

This what I used based on few previous posts. But this code allows me to enter 'n' number of characters in 'm' number of lines. Could someone help me to write a code which takes only 30 characters and 2 lines? {suppose if the first line holds 10 characters then the next line should hold 20 characters but total number of characters should be 30 and lines to be 2.}

Can you post your Html also ?? and var lines = textarea.value.replace(/\r/g, '').split('\n'), lines_removed, char_removed, i; seems some function call but what you have written is incorrect — Alok, Dec 12 '14 at 08:33
http://stackoverflow.com/questions/556767/limiting-number-of-lines-in-textarea It is based on this post i got this code. @Alok — lazyCat, Dec 12 '14 at 08:37
Also note that if you don't have a server-side check of the textbox length this might involve a security issue — JohannesB, Dec 12 '14 at 08:49

Ye Win · Answer 1 · 2014-12-12T08:45:14.223

Hope below code will save your time.

Insert the following JavaScript function into the page head:

<script language="javascript" type="text/javascript">
function limitText(limitField, limitCount, limitNum) { 
    if (limitField.value.length > limitNum) { 
        limitField.value = limitField.value.substring(0, limitNum);
    } else {
        limitCount.value = limitNum - limitField.value.length;
    }
}
</script>

Insert the following code into the page body:

<form name="myform">
    <input name="limitedtextfield" type="text" onKeyDown="limitText(this.form.limitedtextfield,this.form.countdown,15);" 
    onKeyUp="limitText(this.form.limitedtextfield,this.form.countdown,15);" maxlength="15"><br>
    <font size="1">(Maximum characters: 15)<br>
    You have <input readonly type="text" name="countdown" size="3" value="15"> characters left.</font>
</form>

This solution is only for limit the number of characters in textbox with Java Script.

Thanks. I had tried this already.What I need is allow the textarea to enter only 30 characters and **two lines**.@Ye Win — lazyCat, Dec 12 '14 at 08:46
http://www.codeproject.com/Articles/56392/How-to-Limit-the-Number-of-Lines-and-Characters This link will you a lot I think. My testing was fine. @lazyCat — Ye Win, Dec 12 '14 at 09:59

score 0 · Answer 2 · answered Dec 12 '14 at 08:50

Jquery File:

jquery.maxlength.js

/*
             * jQuery Maxlength plugin 1.0.0
             *
             * Copyright (c) 2013 Viral Patel
             * http://viralpatel.net
             *
             * Licensed under the MIT license:
             *   http://www.opensource.org/licenses/mit-license.php
*/


   ;(function ($)
   {

          $.fn.maxlength = function(){

             $("textarea[maxlength], input[maxlength]").keypress(function(event)
             { 
                var key = event.which;

               //all keys including return.
               if(key >= 33 || key == 13 || key == 32) {
                  var maxLength = $(this).attr("maxlength");
                  var length = this.value.length;
                if(length >= maxLength) 
                {                    
                    event.preventDefault();
                }
           }
        });
      }

   })(jQuery);

In Your Main File

<script type="text/javascript">
        $(document).ready(function($){
            $().maxlength();
        });
</script>

How to limit the number of characters and lines in the textbox using javascript?

2 Answers2