Monday, May 19, 2014

Limit the Characters in textarea using jquery

In this article i am going to show how to set limit the Characters in textarea.

Lets take a look.



jQuery Function

      <script>
$(document).ready(function() {
    var text_limit = 100;
    $('#counter').html(text_limit + ' characters remaining');

    $('#textarea').keyup(function() {
        var text_len = $('#textarea').val().length;
        var text_remaining = text_limit - text_len;

        $('#counter').html(text_remaining + ' characters remaining');
      
        if(text_remaining == 0) {
            alert("Only 100 characters allowed");
        }
    });
});
</script>

jQuery Function

<form method="post" action="#">
      <textarea id="textarea" rows="8" cols="30" maxlength="100" ></textarea>
      <div id="counter"></div>
    </form>
Please share your comments and feedback.Thanks.

No comments:

Post a Comment