Limiting number of text entered inside a textareaWe can count the number of text entered by user ( as they type ) inside a textarea and display the sum to user. This will give user an idea about how many chars left to be entered and how to complete the message without hitting the upper limit. Let us start with our text area with id = t1
To display the counting value we used one div layer d1
Any time we can get the text entered inside the textarea by using val().
Length of this string can be calculated like this.
Above two steps we have to calculate every time user enters any character inside the textarea. For this we have to use keyup event of textarea.
Maximum length of string allowed.For this we will use attr() method to set the maximum value of string length allowed.
Here is the full code
With Progress BarBy using JQuery UI we can also show a progress bar along with counter to give a visual display of progress.
Here is how to display the progress bar
Our total JQuery code with progress bar is here