1

I'm facing a very specific issue with chrome (Version 37.0.2062.94 (64-bit)). Whenever I copy paste text into html:textarea (maxlength:1000), it truncates the text to maxlength (which is fine). On editing this text (deleting some characters) it shows corret number of characters left. But now, on adding new characters, it doesn't allow me to add characters and the character count also doesn't change (keeps showing same number of characters left). I'm using prototype for my project. Here's the code:

    random.jsp:
    <textarea rows="5" cols="25" maxlength="1000"></textarea>
    <span class="maxlenTextArea">1000 characters left.</span>

    prototype_extensions.js:
    Function.prototype.textAreaMaxCharacters = function (maxLength, textAreaElement) {    
        textAreaElement.maxLength = 1000;
     var counterSpan = textAreaElement.next('span');
        var originalCounterValue = maxLength - textAreaElement.value.length;

        if(parseFloat(navigator.appVersion.split("MSIE")[1]) <= 7){
            //We only need to do this case for the regular text boxes in IE 7 
            textAreaElement.parentNode.appendChild(document.createElement('br'));
        } 

        var numberRegex = /^-?\d+/;

        //Observe everytime someone types in the textArea and update our counter
        Event.observe(textAreaElement, 'keyup', function (event) {
            if(textAreaElement.value.length > maxLength) { 
              textAreaElement.value = textAreaElement.value.substr(0, maxLength); 
            }         
            var newNumber = maxLength - textAreaElement.value.length;
            var newText = counterSpan.innerHTML.replace(numberRegex, newNumber);
            counterSpan.innerHTML = newText;
        });
        return counterSpan;
    }

I'm not sure why it isn't reading the keypress event on adding characters. This is specific to chrome. I've tried the same thing on w3schools also and the result is same. However, it works fine on http://jsfiddle.net/.

Anubhav Aggarwal
  • 61
  • 5
  • I think this might be a difference between how the browser html counts the characters vs how javascript counts the characters, the way I was able to replicate the problem is with extra new lines in the paragraph, using Chrome 37 64bit – Geek Num 88 Sep 10 '14 at 14:47
  • @GeekNum88, how can we check both the counts? – Anubhav Aggarwal Sep 11 '14 at 07:06
  • I'd suggest not using the maxlength attribute and just using javascript to limit the length so you are only looking at one character count. – Geek Num 88 Sep 11 '14 at 16:32
  • possible duplicate of [Textarea maxlength value not working](http://stackoverflow.com/questions/15249278/textarea-maxlength-value-not-working) – Paul Sweatte Oct 24 '14 at 21:51

0 Answers0