https://github.com/helloilya/jquery-countchar

A simple counter of characters for multiple form fields based on jQuery
https://github.com/helloilya/jquery-countchar

counter javascript jquery jquery-plugin

Last synced: 2 months ago
JSON representation

A simple counter of characters for multiple form fields based on jQuery

• Host: GitHub
• URL: https://github.com/helloilya/jquery-countchar
• Owner: helloilya
• License: mit
• Created: 2015-09-08T08:20:16.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2016-04-10T12:13:57.000Z (almost 9 years ago)
• Last Synced: 2024-05-22T21:35:17.347Z (8 months ago)
• Topics: counter, javascript, jquery, jquery-plugin
• Language: JavaScript
• Homepage:
• Size: 6.84 KB
• Stars: 3
• Watchers: 2
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# jQuery countChar plugin

> A simple counter of characters for multiple form fields based on jQuery

### Demo

Example is located [here](http://fedotov.work/jquery-countchar/).

### Usage

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:

```js

$('.selector').countChar();

```

### Options

You can use the following options as plugin params:

* `text` — Text for the counter;

* `textPosition` — Text position for the counter: `before` or `after`. Defaults to `before`;

* `limit` — Maximum number of characters for each field;

* `limitErrorClass` — Error class name for limit. Defaults to `countchar-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:

```html

```

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.

### Release History

* 1.1.0 — Added npm support.

* 1.0.0 — Added bower support.

### License

MIT © [Ilya Fedotov](http://fedotov.me)