A simple counter of characters for multiple form fields based on jQuery
Example is located here.
Install via bower:
$ bower install jquery-countchar --save
or via npm:
$ npm install jquery-countchar --save
or download the jquery.countchar.min.js
file into your repo.
Then, include script file after the jQuery library and initialize the plugin:
$('.selector').countChar();
You can use the following options as plugin params:
text
— Text for the counter;textPosition
— Text position for the counter:before
orafter
. Defaults tobefore
;limit
— Maximum number of characters for each field;limitErrorClass
— Error class name for limit. Defaults tocountchar-limit-error
;outputContainer
— Container for output text and counter. Defaults to#countchar-output
;onLimitCallback(el, value)
— Callback function called when limit condition worked;onCounterCallback(number)
— Callback function called each time when it counted the number of characters.
Also, you can add data-countchar
and data-countchar-limit
attributes to set a regular expression and a characters limit for the current form field. For example:
<input type="text" name="example" data-countchar="[\d]+" data-countchar-limit="10">
It will count only numbers and the maximum number of characters will 10. If the characters will be more, it will add error class to the input
element. The priority data-countchar-limit
more than the limit
parameter.
- 1.1.0 — Added npm support.
- 1.0.0 — Added bower support.
MIT © Ilya Fedotov