Bootstrap – Jquery Plugin to Count Characters and Validate maximum length of the field

In this post i am going to share Simple Bootstrap Plugin which help you to show a visual feedback to the user about the maximum length of the field where the user is typing text.

In this Plugin Uses the HTML5 attribute “maxlength” to work.

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

    <title>Bootstrap MaxLength - </title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="">
    <!-- jQuery library -->
    <script src=""></script>
    <!-- Latest compiled JavaScript -->
    <script src=""></script>
    <!-- Bootstrap Maxlength Plugin -->
    <script src=""></script>

<div class="container">
    <h3>Bootstrap MaxLength</h3>
    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="inputsm">Mobile</label>
                <input class="form-control" id="inputsm" type="text">
            <div class="form-group">
                <label for="inputlg">SMS Text</label>
                <textarea class="form-control" maxlength="160"></textarea>
            <div class="form-group">
                <button class="btn btn-success" type="submit">SEND</button>

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


For More Information and future updates : Visit their official github repository

You May Also Like

Leave a Reply

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