jQuery plugin to validate the maximum length of the field and count characters.

Brijpal Sharma
html css Publish on:-April 30th, 2019 , Category:- Web Development

This is tips we learn how to use jQuery plugin to validate the maximum length of the field and count characters with bootstrap.

validation is most important for the form where restrict for limitation for word and field. In this post, we learn how to do this thing with the help of jQuery plugin with bootstrap.

In this Plugin Uses the HTML5 attribute "maxlength" to work.

Below I added very simple example code to use that plugin you can check it and let me know any queries.

<html>
<head>
  <title>Bootstrap MaxLength - </title>
  <!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <!-- jQuery library -->
  <script src=//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js></script>
  <!-- Latest compiled JavaScript -->
  <script src=//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js></script>
  <!-- Bootstrap Maxlength Plugin -->
  <script src=//cdnjs.cloudflare.com/ajax/libs/bootstrap-maxlength/1.7.0/bootstrap-maxlength.min.js></script>
</head>
<body>

<div >
  <h3>jQuery plugin to validate the maximum length of the field and count characters.</h3>
  <div >
    <div >
      <div >
        <label for="inputsm">Mobile</label>
        <input id="inputsm" type=text>
      </div>
      <div >
        <label for="inputlg">SMS Text</label>
        <textarea maxlength="200"></textarea>
      </div>
      <div >
        <button type=submit>SEND</button>
      </div>
    </div>
  </div>
</div>

<script type=text/javascript>
  $('textarea').maxlength({
    alwaysShow: true,
    threshold: 10,
    warningClass: "label label-success",
    limitReachedClass: "label label-danger",
    separator: ' out of ',
    preText: 'You write ',
    postText: ' chars.',
    validate: true
  });
</script>

</body>
</html>

Now, here we completed tutorials on jQuery plugin to validate the maximum length of the field and count characters.

good luck

Brijpal Sharma

Hello, My Name is Brijpal Sharma. I am a Web Developer, Professional Blogger and Digital Marketer from India. I am the founder of Codermen. I started this blog to help web developers & bloggers by providing easy and best tutorials, articles and offers for web developers and bloggers...

0 Comments

You must be logged in to post a comment.