|
@@ -891,142 +891,13 @@ Validate a given value against the mask.
|
|
|
var isValid = inputmask.isValid("23/03/1973", { alias: "dd/mm/yyyy"});
|
|
var isValid = inputmask.isValid("23/03/1973", { alias: "dd/mm/yyyy"});
|
|
|
```
|
|
```
|
|
|
|
|
|
|
|
-## .NET Nuget Package Install
|
|
|
|
|
-
|
|
|
|
|
-```html
|
|
|
|
|
-PM> Install-Package jQuery.InputMask
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-In App_Start, BundleConfig.cs
|
|
|
|
|
-
|
|
|
|
|
-```c#
|
|
|
|
|
-bundles.Add(new ScriptBundle("~/bundles/inputmask").Include(
|
|
|
|
|
- "~/Scripts/jquery.inputmask/inputmask.js",
|
|
|
|
|
- "~/Scripts/jquery.inputmask/jquery.inputmask.js",
|
|
|
|
|
- "~/Scripts/jquery.inputmask/inputmask.extensions.js",
|
|
|
|
|
- "~/Scripts/jquery.inputmask/inputmask.date.extensions.js",
|
|
|
|
|
- //and other extensions you want to include
|
|
|
|
|
- "~/Scripts/jquery.inputmask/inputmask.numeric.extensions.js"));
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-In Layout
|
|
|
|
|
-
|
|
|
|
|
-```html
|
|
|
|
|
-@Scripts.Render("~/bundles/inputmask")
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
# jquery.inputmask extensions
|
|
# jquery.inputmask extensions
|
|
|
-# =========== TODO ===========
|
|
|
|
|
-## date & datetime extensions
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("dd/mm/yyyy");
|
|
|
|
|
- $(selector).inputmask("mm/dd/yyyy");
|
|
|
|
|
- $(selector).inputmask("date"); // alias for dd/mm/yyyy
|
|
|
|
|
- $(selector).inputmask("date", {yearrange: { minyear: 1900, maxyear: 2099 }}); //specify year range
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-The date aliases take leap years into account. There is also autocompletion on day, month, year. For example:
|
|
|
|
|
-
|
|
|
|
|
-input: 2/2/2012 result: 02/02/2012<br>input: 352012 result: 03/05/2012<br>input: 3/530 result: 03/05/2030<br>input: ctrl rightarrow result: the date from today
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("datetime"); // 24h
|
|
|
|
|
- $(selector).inputmask("datetime12"); // am/pm
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-### jqueryui.datepicker example
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
- $('#calender').datepicker({
|
|
|
|
|
- dateFormat: 'dd/mm/yy',
|
|
|
|
|
- changeMonth: true,
|
|
|
|
|
- changeYear: true
|
|
|
|
|
- }).inputmask('dd/mm/yyyy');
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-## numeric extensions
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("decimal");
|
|
|
|
|
- $(selector).inputmask("decimal", { allowMinus: false });
|
|
|
|
|
- $(selector).inputmask("integer");
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-Define the radixpoint
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("decimal", { radixPoint: "," });
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-Define the number of digits after the radixpoint
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("decimal", { digits: 3 });
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-When TAB out of the input the digits autocomplate with 0 if the digits option is given a valid number.
|
|
|
|
|
-
|
|
|
|
|
-Grouping support through: autoGroup, groupSeparator, groupSize
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("decimal", { radixPoint: ",", autoGroup: true, groupSeparator: ".", groupSize: 3 });
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-Allow minus and/or plus symbol
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("decimal", { allowMinus: false });
|
|
|
|
|
- $(selector).inputmask("integer", { allowMinus: false, allowPlus: true });
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-## regex extensions
|
|
|
|
|
-With the regex extension you can use any regular expression as a mask. Currently this does only input restriction.<br>There is no further masking visualization.
|
|
|
|
|
-
|
|
|
|
|
-Example simple email regex:
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask('Regex', { regex: "[a-zA-Z0-9._%-]+@[a-zA-Z0-9-]+\\.[a-zA-Z]{2,4}" });
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-## phone extensions
|
|
|
|
|
-Uses the phone mask definitions from [https://github.com/andr-04/inputmask-multi](https://github.com/andr-04/inputmask-multi)
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
- $(selector).inputmask("phone", {
|
|
|
|
|
- url: "Scripts/jquery.inputmask/phone-codes/phone-codes.json",
|
|
|
|
|
- onKeyValidation: function () { //show some metadata in the console
|
|
|
|
|
- console.log($(this).inputmask("getmetadata")["name_en"]);
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
-```
|
|
|
|
|
-
|
|
|
|
|
-## other extensions
|
|
|
|
|
-An ip address alias for entering valid ip-addresses.
|
|
|
|
|
-
|
|
|
|
|
-```javascript
|
|
|
|
|
-$(document).ready(function(){
|
|
|
|
|
- $(selector).inputmask("ip");
|
|
|
|
|
-});
|
|
|
|
|
-```
|
|
|
|
|
|
|
|
|
|
-You can find/modify/extend this alias in the jquery.inputmask.extensions.js
|
|
|
|
|
|
|
+###[date & datetime extensions](README_date.md)
|
|
|
|
|
+###[numeric extensions](README_numeric.md)
|
|
|
|
|
+###[regex extensions](README_regex.md)
|
|
|
|
|
+###[phone extensions](README_phone.md)
|
|
|
|
|
+###[other extensions](README_other.md)
|
|
|
|
|
|
|
|
[npm-url]: https://npmjs.org/package/jquery.inputmask
|
|
[npm-url]: https://npmjs.org/package/jquery.inputmask
|
|
|
[npm-image]: https://img.shields.io/npm/v/jquery.inputmask.svg
|
|
[npm-image]: https://img.shields.io/npm/v/jquery.inputmask.svg
|