Limit The Number Of Digits In Input - jQuery maxlength.js
File Size: | 11.6 KB |
---|---|
Views Total: | 90 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

maxlength.js is a feature-rich jQuery plugin that limits the number of digits and auto-formats numeric values in input fields. Can be helpful in ensuring data integrity and minimizing input errors.
Features:
- Restrict the number of digits allowed in input fields.
- Format numbers with thousand separators and rounded fractional digits automatically.
- Apply custom colors to negative number inputs.
- And more.
How to use it:
1. Include the minified version of the maxlength.js plugin after jQuery.
<script src="/path/to/cdn/jquery.slim.min.js"></script> <script src="/path/to/jquery.maxlength.min.js"></script>
2. To initialize the plugin, simply add the data-max-length
to the input field.
<!-- Only positive numbers are allowed --> <!-- Maximum number of digits: 10 --> <!-- Maximum decimal places: 2 --> <input data-max-length="+10.2" />
<!-- Positive and negative numbers are allowed --> <!-- Maximum number of digits: 5 --> <!-- Maximum decimal places: 1 --> <input data-max-length="-5.1" />
3. More HTML5 data
attributes to customize the plugin.
- data-disable-autofill: Disable fractional autofill.
- data-disable-auto-comma: Disable comma autofill.
- data-disable-smart-minus: Disable smart minus configuration.
- data-disable-init-refresh: Disable the initial refresh.
- data-enable-highlight-minus: Enable highlighting of negative values in either default red or the assigned hexadecimal color.
- data-horizontal-align: 'Left', 'Center', or 'Right'(Default).
<input data-max-length="-6.2" data-disable-autofill data-disable-auto-comma data-disable-smart-minus data-disable-init-refresh data-horizontal-align="left" data-enable-highlight-minus="#00ff00" />
4. It also allows you to sum numbers of multiple input fields.
<input type="text" class="sumTarget" data-max-length="-5.2"> <input type="text" class="sumTarget" data-max-length="-5.2"> <input type="text" data-sum="input.sumTarget" data-max-length="-6.2">
Changelog:
2023-06-03
- Change NumberUtil() to an extended object of jQuery: $.NumberUtil.
2023-05-21
- Remove unused exports of the internal util.
2023-05-10
- Bugfix
This awesome jQuery plugin is developed by scintilla0. For more Advanced Usages, please check the demo page or visit the official website.