How to count number of characters limit in textarea Javascript

How to count number of characters limit in textarea Javascript

In this post we will give you information about How to count number of characters limit in textarea Javascript. Hear we will give you detail about How to count number of characters limit in textarea JavascriptAnd how to use it also give you demo for it if it is necessary.

In this post, i will let you know how to count number of characters limit in textarea and show the available remaining characters that you can enter.

For example, If you are going to send SMS from application then there you can use this validation for apply characters limit.

In this example, you will know the use of onkeyup and onkeydown event.

onkeyup event is triggered when a keyboard key is released and onkeydown event is triggered when a keyboard key is pressed.

  1. <!DOCTYPEhtml>
  2. <html>
  3. <head>
  4. <title>Javascript Maxlength Validation with Example</title>
  5. </head>
  6. <body>
  7. <form>
  8. <textareaname="message"placeholder="Type here to see how it work"onkeydown="limitText(this.form.message,this.form.countdown,160);"onkeyup='limitText(this.form.message,this.form.countdown,160);'></textarea>
  9. You have
  10. <inputreadonlytype="text"name="countdown"size="3"value="160"> chars left
  11. </form>
  12. <scripttype="text/javascript">
  13. function limitText(limitField, limitCount, limitNum) {
  14. if (limitField.value.length > limitNum) {
  15. limitField.value = limitField.value.substring(0, limitNum);
  16. } else {
  17. limitCount.value = limitNum - limitField.value.length;
  18. }
  19. }
  20. </script>
  21. </body>
  22. </html>
<!DOCTYPE html>
<html>
<head>
    <title>Javascript Maxlength Validation with Example</title>
</head>
<body>
    <form>
        <textarea  name="message" placeholder="Type here to see how it work" onkeydown="limitText(this.form.message,this.form.countdown,160);" onkeyup='limitText(this.form.message,this.form.countdown,160);'></textarea>
        You have
        <input readonly type="text" name="countdown" size="3" value="160"> chars left
    </form>
    <script type="text/javascript">
       function limitText(limitField, limitCount, limitNum) {
          if (limitField.value.length > limitNum) {
            limitField.value = limitField.value.substring(0, limitNum);
          } else {
            limitCount.value = limitNum - limitField.value.length;
          }
        }
    </script>
</body>
</html>


Click here to know the Javascript Bootstrap – Textarea count characters validation with example

This is a simple example for character countdown in textarea using Javascript.


Show Demo

Label :

HTML

jQuery

How To

Web Development

JavaScript

Hope this code and post will helped you for implement How to count number of characters limit in textarea Javascript. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

Leave a Comment

Your email address will not be published. Required fields are marked *

  +  46  =  50

We're accepting well-written guest posts and this is a great opportunity to collaborate : Contact US