Textarea count characters validation

Question

i'm writing an asp page using vb.net and i need to count the number of characters in my textarea and display the message:"X characters Remaining."

that's my asp code:

  <td valign='top'>
                <textarea rows="5" id="content_txt" name="TextArea1" runat="server" maxlength="50"></textarea>
            </td>

possible duplicate of [Count characters in textarea](http://stackoverflow.com/questions/5371089/count-characters-in-textarea) — mplungjan, Sep 04 '13 at 07:58

score 3 · Accepted Answer · edited May 08 '17 at 08:08

3

Here is a JSFiddle

HTML:

<textarea rows="5" id="content_txt" name="TextArea1" runat="server" maxlength="50"></textarea>
<p id="message"></p>

JS:

var area = document.getElementById("content_txt");
var message = document.getElementById("message");
var maxLength = 50;
var checkLength = function() {
    if(area.value.length < maxLength) {
        message.innerHTML = (maxLength-area.value.length) + " characters remaining";
    }
}
setInterval(checkLength, 300);

edited May 08 '17 at 08:08

illright

3,991
2
29
54

answered Sep 04 '13 at 08:01

Krasimir

13,306
3
40
55

1

Wonder why did you prefer time interval over events – Oct 17 '14 at 08:44
Replace `<` with `<=` - fixes a problem where the count is stuck at 1. – Albert MN. Mar 07 '16 at 09:32

score 3 · Answer 2 · answered Apr 30 '14 at 01:56

3

I have a little but functional solution my friend, try this:

HTML CODE

    <textarea name="message"placeholder="Reply message..." maxlength="155" onkeyup="counter(this);"></textarea>
<div id="counter_div">0/155</div>

JAVASCRIPT CODE

<script>
    function counter(msg){
        document.getElementById('counter_div').innerHTML = msg.value.length+'/155';
    }
</script>

This case limit 155 characters.

answered Apr 30 '14 at 01:56

user3416787

31
2

Upvote for a summarized solutions. Simple – Kelvin Mboto Apr 28 '21 at 17:57

score 1 · Answer 3 · answered Sep 04 '13 at 07:58

1

this will return current length of the textarea using jquery var length = $('#content_txt').val().length; and rest of the logic you have to give it a try..

answered Sep 04 '13 at 07:58

FosterZ

3,863
6
38
62

Bibhu · Answer 4 · 2013-09-04T08:08:39.960

0

<td valign='top'>
  <textarea rows="5" id="content_txt" name="TextArea1" runat="server" maxlength="50"></textarea>
  <span id="character-count">100</span> characters remaining.
</td>


var totallength = 100;

$('textarea#input').on('keydown, keyup', function(e) {
     $('span#character-count').text((totallength - input.val().length));
});

edited Sep 04 '13 at 08:08

answered Sep 04 '13 at 08:02

Bibhu

4,053
4
33
63

score 0 · Answer 5 · answered Sep 04 '13 at 08:03

try this

  function fix(dis)
    {
      var total=50; // ho many you want to show
      var val = dis.value;

      var count = val.length;
      document.getElementById('remaining').innerHTML= total-count;
    }

    <td valign='top'>
        <textarea rows="5" id="content_txt" name="TextArea1" runat="server" maxlength="50" onkeyup="fix(this)"></textarea>
    </td>

    <p><span id="remaining">0</span> Characters remaining</p>

Textarea count characters validation

5 Answers5