Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Dec 2006
    Posts
    417
    Thanks
    168
    Thanked 1 Time in 1 Post

    Counting the number of characters left in an input field

    Hello, I am trying to create a textarea that counts the number of characters that the user is able to input and sets a maximum limit:

    Code:
    <html>
    <head>
    <script>
    
    <script type="text/javascript">
    
    function limitlength(obj, length){
    	var maxlength = length; // error log says there is a syntax error here!!
    	if (obj.value.length>maxlength) {
    		obj.value=obj.value.substring(0, maxlength)
    	}
    	div.documentGetElementByID('keyStrokesLeft').innerHTML = "keystrokes left: " + (maxlength-obj.value.length-length);
    }
    
    </script>
    
    </head>
    <body>
    Enter text (max length is 20 characters):
    <form>
    <textarea onkeyup="return limitlength(this, 20)" style="width: 300px; height: 90px"></textarea>
    <div id="keyStrokesLeft"></div>
    </form>
    </body>
    </html>
    Firebug (error checker) keeps giving me the following error:

    Code:
    syntax error: var maxlength = length;
    that line looks great... any idea why I am getting this error?

  • #2
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    I believe length is a preserved word, try using len instead.

  • #3
    Regular Coder
    Join Date
    Dec 2006
    Posts
    417
    Thanks
    168
    Thanked 1 Time in 1 Post
    good thought.. I tried it and I get the same error:

    Code:
    <html>
    <head>
    <script>
    
    <script type="text/javascript">
    
    function limitlength(obj, characterlength){
    	var maxlength = characterlength;
    	if (obj.value.length>maxlength) {
    		obj.value=obj.value.substring(0, maxlength)
    	}
    	div.documentGetElementByID('keyStrokesLeft').innerHTML = "keystrokes left: " + (maxlength-obj.value.length);
    }
    
    </script>
    
    </head>
    <body>
    Enter text (max length is 20 characters):
    <form>
    <textarea onkeyup="return limitlength(this, 20)" style="width: 300px; height: 90px"></textarea>
    <div id="keyStrokesLeft"></div>
    </form>
    </body>
    </html>
    error:

    Code:
    syntax error: var maxlength = characterlength;

  • #4
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    I found couple of errors in your script:
    1. there was <script> before <script type="text/javascript">
    2. you wrote div.documentGetElementByID which is wrong.

    This will work for you:
    Code:
    <html>
    <head>
    <script type="text/javascript">
    function limitlength(obj,characterlength)
    {
    	var maxlength = characterlength;
    	if (obj.value.length>maxlength) {
    		obj.value=obj.value.substring(0, maxlength);
    	}
    	document.getElementById('keyStrokesLeft').innerHTML = "keystrokes left: " + (maxlength-obj.value.length);
    }
    </script>
    
    </head>
    <body>
    Enter text (max length is 20 characters):
    <form>
    <textarea onkeyup="limitlength(this,20);" style="width: 300px; height: 90px"></textarea>
    <div id="keyStrokesLeft"></div>
    </form>
    </body>
    </html>

  • #5
    New Coder
    Join Date
    Jan 2007
    Posts
    93
    Thanks
    0
    Thanked 0 Times in 0 Posts
    var maxlength = characterlength
    Why set a new variable that is not modified or altered at any point?
    (I could see it being done were the original value is later needed)


    This should work just as good.

    Code:
    function limitlength(obj,len)
    {
    	if (obj.value.length>len) {
    		obj.value=obj.value.substring(0, len);
    Last edited by tonyp12; 02-11-2007 at 10:13 PM.

  • #6
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    Yup, you're right. Instead of setting a long difficult variable at the function parameters, you'd better set it to a short variable without any help of another variable.
    Though it would just make your code more efficient and not your script loading time faster.
    Last edited by BarrMan; 02-11-2007 at 11:06 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •