https://github.com/json2d/jquery.input-allow
A jQuery plugin that provides lightweight unobtrusive real-time regEx filtering for individual characters entered into input fields.
https://github.com/json2d/jquery.input-allow
Last synced: 3 months ago
JSON representation
A jQuery plugin that provides lightweight unobtrusive real-time regEx filtering for individual characters entered into input fields.
- Host: GitHub
- URL: https://github.com/json2d/jquery.input-allow
- Owner: json2d
- License: mit
- Created: 2015-11-12T09:36:27.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2015-11-12T09:40:30.000Z (almost 10 years ago)
- Last Synced: 2025-06-17T04:07:02.363Z (4 months ago)
- Language: JavaScript
- Size: 0 Bytes
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# jquery.input-allow v0.1
*by Jason Yung - [http://callmejay.com](http://callmejay.com "http://callmejay.com")*
A [jQuery](http://jquery.com) plugin that provides lightweight unobtrusive real-time regEx filtering for individual characters entered into input fields.
### Basic Usage
Simply use the **allow** attribute on any **input** tag to specify a regEx to filter by.
```html
```
### Dynamic Content Support
The plugin uses `$('body').delegate(...)` to bind its core handlers to any and every **input** tag that has an **allow** attribute defined, including those added dynamically:
```javascript
$('body').append(""); //works out of the box!
```
### Events
Each character entered into a filtered input field is compared to some regEx:
- If a character matches, the **input** element will trigger an **input-allow.pass** event
- If a character does not match, the **input** element will trigger an **input-allow.fail** event
To bind a handler to these events, you can use `on` or `delegate`:
```javascript
$('input[allow]').on('input-allow.fail', function(event) {
event.target.css('background','red'); //input was bad - color the element red
});
// dynamic content support
$('body').delegate('input-allow.pass', 'input[allow]',function(event){
event.target.css('background','green'); //input was good - color the element green
});
```
### Known Issues
- Edge cases were not really considered.
### Roadmap
TODO