jQuery Plugin For Input Counter – jquery.input-counter.js

InputCounter is a simple but powerful jQuery plugin for a input counter. It is lightweight Bootstrap compatible jQuery input spinner plugin to increments and decrements numeric values with plus/minus buttons.


Load the following jQuery and Plugins library on page.

<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script src="jquery.input-counter.min.js"></script>


The vary basic HTML to display input spinner.

<div class="input-counter input-group">
    <div class="input-group-prepend">
        <button type="button" class="btn-add btn btn-primary">
            <i class="fa fa-plus"></i>
    <input type="text" class="form-control counter" data-default="1" data-min="0" data-max="100">
    <div class="input-group-append">
        <button type="button" class="btn-subtract btn btn-primary">
            <i class="fa fa-minus"></i>


Call the plugin’s function to enable the input spinner.


Use following option to customize input spinner.

var options = {
    selectors: {
        addButtonSelector: '.btn-add',              
        subtractButtonSelector: '.btn-subtract',    
        inputSelector: '.counter',                  // the selector for the <input />-field
    settings: {
        checkValue: true,                           
        isReadOnly: true,                           

See live demo and download source code.


This awesome plugin is developed by lk-code. Visit their official github repository for more information and follow for future updates.