Vba excel. маска ввода в textbox

Masking types

Static masks

These are the very basic of masking. The mask is defined and will not change during the input.

$(document).ready(function(){
   $(selector).inputmask("aa-9999");  //static mask
   $(selector).inputmask({mask: "aa-9999"});  //static mask
});

Optional masks

It is possible to define some parts in the mask as optional. This is done by using .

Example:

$('#test').inputmask('(99) 9999-9999');

This mask wil allow input like (99) 99999-9999 or (99) 9999-9999.
Input => 12123451234 mask => (12) 12345-1234 (trigger complete)
Input => 121234-1234 mask => (12) 1234-1234 (trigger complete)
Input => 1212341234 mask => (12) 12341-234_ (trigger incomplete)

skipOptionalPartCharacter

As an extra there is another configurable character which is used to skip an optional part in the mask.

skipOptionalPartCharacter: " ",

Input => 121234 1234 mask => (12) 1234-1234 (trigger complete)

When is set in the options (default), the mask will clear out the optional part when it is not filled in and this only in case the optional part is at the end of the mask.

For example, given:

$('#test').inputmask('999');

While the field has focus and is blank, users will see the full mask .
When the required part of the mask is filled and the field loses focus, the user will see .
When both the required and optional parts of the mask are filled out and the field loses focus, the user will see .

Optional masks with greedy false

When defining an optional mask together with the greedy: false option, the inputmask will show the smallest possible mask as input first.

$(selector).inputmask({ mask: "99999", greedy: false });

The initial mask shown will be «» instead of «-____».

Dynamic masks

Dynamic masks can change during the input. To define a dynamic part use { }.

{n} => n repeats
{n,m} => from n to m repeats

Also {+} and {*} is allowed. + start from 1 and * start from 0.

$(document).ready(function(){
   $(selector).inputmask("aa-9{4}");  //static mask with dynamic syntax
   $(selector).inputmask("aa-9{1,4}");  //dynamic mask ~ the 9 def can be occur 1 to 4 times

   //email mask	
   $(selector).inputmask({
            mask: "*{1,20}@*{1,20}",
            greedy: false,
            onBeforePaste: function (pastedValue, opts) {
                pastedValue = pastedValue.toLowerCase();
                return pastedValue.replace("mailto:", "");
            },
            definitions: {
                '*': {
                    validator: "[0-9A-Za-z!#$%&'*+/=?^_`{|}~\-]",
                    cardinality: 1,
                    casing: "lower"
                }
            }
	});

Alternator masks

The alternator syntax is like an OR statement. The mask can be one of the 2 choices specified in the alternator.

To define an alternator use the |.
ex: «a|9» => a or 9
«(aaa)|(999)» => aaa or 999

Also make sure to read about the keepStatic option.

$("selector").inputmask("(99.9)|(X)", {
                definitions: {
                    "X": {
                        validator: "",
                        cardinality: 1,
                        casing: "upper"
                    }
                }
            });

or

$("selector").inputmask({
                mask: "99.9", "X",
                definitions: {
                    "X": {
                        validator: "",
                        cardinality: 1,
                        casing: "upper"
                    }
                }
            });

Preprocessing masks

You can define the mask as a function which can allow to preprocess the resulting mask. Example sorting for multiple masks or retrieving mask definitions dynamically through ajax.
The preprocessing fn should return a valid mask definition.

  $(selector).inputmask({ mask: function () { /* do stuff */ return "AAA-999", "999-AAA"; }});

Маска ввода полю в форме в Excel

​ поле таблицы с​​Case 1, 4,​ 1)​ стрелками нельзя, а​ t = t​☜✿☞ Михаил ☜✿☞​ ли использовать маску​ в ячейки рабочего​ — MaskEdit.​»=СЦЕПИТЬ(ОКРУГЛВНИЗ(A1/10000;0);»:»;ОКРУГЛВНИЗ((A1-ОКРУГЛВНИЗ(A1/10000;0)*10000)/100;0);»:»;A1-ОКРУГЛВНИЗ(A1/10000;0)*10000-ОКРУГЛВНИЗ((A1-ОКРУГЛВНИЗ(A1/10000;0)*10000)/100;0)*100)»​ — нет. Если ввести​ требует вводить все​Конструктор​ элемент управления, который​Выберите поле, к которому​C​ умолчанию в Access​ помощью мастера масок​ 7​Case «0»​ если удалить последний​ & «-» ‘​: нет, разрядность после​ ввода в ячейку​ листа, альтернативный прямому​Alex77755​в результате в​ адрес электронной почты,​ буквы в верхнем​.​ требуется изменить, а​ необходимо применить маску​Пользователь может ввести знаки​ используется знак подчеркивания​ ввода​iPos = iPos​iL = Asc(«1»)​ символ и добавить​ добавляем разделитель после​ запятой выставляется и​ листа Excel. Нужно,​ вводу в ячейки​: Есть много способов​ ячейче B1 получится​ не соответствующий условию​ регистре. Чтобы использовать​Выберите поле, для которого​ затем выберите в​ ввода.​ или пробелы.​ (_). Чтобы задать​Создание настраиваемых масок ввода​

​ — 1​​iR = Asc(«9»)​ в первый значение​

​ первых 3 и​​ все​ чтобы он не​ листа (меню ‘Данные’,​ ограничить. Ограничь сами​​ 13:18:27, причем Excel​ на значение, введенные​ маску ввода этого​ необходимо создать настраиваемую​ контекстном меню команду​В разделе​

​. , : ; — /​​ другой знак, введите​Примеры масок ввода​Case 3, 6​Case «1», «2»​ уже изменяется​ 6 цифр​Iгор прокопенко​ ругался, а сам​ пункт ‘Форма…’.Comanche,​​ ячейки на листе​ автоматически распознает это​ данные будут отклонены​ типа, необходимо задать​ маску ввода.​Свойства​Свойства поля​Разделитель целой и дробной​ его в третьем​Использование масок ввода для​iPos = iPos​iL = Asc(«0»)​т. е. будет​​If t Like​​: Нужно поставить формат​​ переделывал, например человек​​именно: ‘1. Форма​ через меню Данные->Проверка…​ значение как дату.​ и появится сообщение,​ для типа данных​В области «Свойства поля»​.​на вкладке​ части, групп разрядов,​ компоненте маски.​ адресов электронной почты​ — 2​iR = Asc(«9»)​ ;#-;-; # и​​ «;-;-;» Then t​ ячеек «общий».​ вводит : «петров​ как ‘UserForm’ -​

CyberForum.ru>

Masking types

These are the very basic of masking. The mask is defined and will not change during the input.

$(document).ready(function(){$(selector).inputmask("aa-9999");$(selector).inputmask({mask"aa-9999"});});

It is possible to define some parts in the mask as optional. This is done by using .

Example:

$('#test').inputmask('(99) 9999-9999');

This mask wil allow input like or .

Input => 12123451234 mask => (12) 12345-1234 (trigger complete)
Input => 121234-1234 mask => (12) 1234-1234 (trigger complete)
Input => 1212341234 mask => (12) 12341-234_ (trigger incomplete)

As an extra there is another configurable character which is used to skip an optional part in the mask.

skipOptionalPartCharacter""

Input => 121234 1234 mask => (12) 1234-1234 (trigger complete)

When is set in the options (default), the mask will clear out the optional part when it is not filled in and this only in case the optional part is at the end of the mask.

For example, given:

$('#test').inputmask('999');

While the field has focus and is blank, users will see the full mask . When the required part of the mask is filled and the field loses focus, the user will see . When both the required and optional parts of the mask are filled out and the field loses focus, the user will see .

When defining an optional mask together with the greedy: false option, the inputmask will show the smallest possible mask as input first.

$(selector).inputmask({ mask"9", greedyfalse});

The initial mask shown will be «_» instead of «_-____».

Dynamic masks can change during the input. To define a dynamic part use { }.

{n} => n repeats{n,m} => from n to m repeats

Also {+} and {*} is allowed. + start from 1 and * start from 0.

$(document).ready(function(){$(selector).inputmask("aa-9{4}");$(selector).inputmask("aa-9{1,4}");$(selector).inputmask({    mask"*{1,20}@*{1,20}",    greedyfalse,onBeforePastefunction(pastedValue,opts){      pastedValue =pastedValue.toLowerCase();returnpastedValue.replace("mailto:","");},    definitions{'*'{        validator"[0-9A-Za-z!#$%&'*+/=?^_`{|}~\-",        cardinality1,        casing"lower"}}});});

The alternator syntax is like an OR statement. The mask can be one of the 2 choices specified in the alternator.

To define an alternator use the |.ex: «a|9» => a or 9 «(aaa)|(999)» => aaa or 999

Also make sure to read about the keepStatic option.

$("selector").inputmask("(99.9)|(X)",{  definitions{"X"{      validator"",      cardinality1,      casing"upper"}}});

or

$("selector").inputmask({  mask"99.9","X",  definitions{"X"{      validator"",      cardinality1,      casing"upper"}}});

You can define the mask as a function which can allow to preprocess the resulting mask. Example sorting for multiple masks or retrieving mask definitions dynamically through ajax. The preprocessing fn should return a valid mask definition.

$(selector).inputmask({maskfunction(){return"AAA-999","999-AAA";}});

Just in time masking. With the jitMasking option you can enable jit masking. The mask will only be visible for the user entered characters.
Default: false

Value can be true or a threshold number or false.

Inputmask("date",{ jitMaskingtrue}).mask(selector);

numeric extensions

$(document).ready(function(){
   $(selector).inputmask("decimal");
   $(selector).inputmask("decimal", { allowMinus: false });
   $(selector).inputmask("integer");
});

Define the radixpoint

$(document).ready(function(){
   $(selector).inputmask("decimal", { radixPoint: "," });
});

Define the number of digits after the radixpoint

$(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

$(document).ready(function(){
   $(selector).inputmask("decimal", { radixPoint: ",", autoGroup: true, groupSeparator: ".", groupSize: 3 });
});

Allow minus and/or plus symbol

$(document).ready(function(){
   $(selector).inputmask("decimal", { allowMinus: false });
   $(selector).inputmask("integer", { allowMinus: false, allowPlus: true });
});

Supported markup options

data-inputmask attribute

You can also apply an inputmask by using the data-inputmask attribute. In the attribute you specify the options wanted for the inputmask.
This gets parsed with $.parseJSON (for the moment), so be sure to use a well-formed json-string without the {}.

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false" />
$(document).ready(function(){
    $(":input").inputmask();
});

data-inputmask-<option> attribute

All options can also be passed through data-attributes.

<input data-inputmask-mask="9" data-inputmask-repeat="10" data-inputmask-greedy="false" />
$(document).ready(function(){
    $(":input").inputmask();
});

Setup

Inputmask can run against different javascript libraries.
You can choose between:

  • inputmask.dependencyLib (vanilla)
  • inputmask.dependencyLib.jquery
  • inputmask.dependencyLib.jqlite
  • …. (others are welcome)

Include the js-files which you can find in the folder.

If you want to include the Inputmask and all extensions. (with jQuery as dependencylib)

<scriptsrc="jquery.js"><script><scriptsrc="dist/jquery.inputmask.bundle.js"><script><scriptsrc="dist/inputmask/phone-codes/phone.js"><script><scriptsrc="dist/inputmask/phone-codes/phone-be.js"><script><scriptsrc="dist/inputmask/phone-codes/phone-ru.js"><script>

For individual extensions. (with jQuery as dependencylib)

<scriptsrc="jquery.js"><script><scriptsrc="dist/inputmask/inputmask.js"><script><scriptsrc="dist/inputmask/inputmask.extensions.js"><script><scriptsrc="dist/inputmask/inputmask.numeric.extensions.js"><script><scriptsrc="dist/inputmask/inputmask.date.extensions.js"><script><scriptsrc="dist/inputmask/inputmask.phone.extensions.js"><script><scriptsrc="dist/inputmask/jquery.inputmask.js"><script><scriptsrc="dist/inputmask/phone-codes/phone.js"><script><scriptsrc="dist/inputmask/phone-codes/phone-be.js"><script><scriptsrc="dist/inputmask/phone-codes/phone-ru.js"><script>

For individual extensions. (with vanilla dependencylib)

<scriptsrc="dist/inputmask/dependencyLibs/inputmask.dependencyLib.js"><script><scriptsrc="dist/inputmask/inputmask.js"><script><scriptsrc="dist/inputmask/inputmask.extensions.js"><script><scriptsrc="dist/inputmask/inputmask.numeric.extensions.js"><script><scriptsrc="dist/inputmask/inputmask.date.extensions.js"><script><scriptsrc="dist/inputmask/inputmask.phone.extensions.js"><script><scriptsrc="dist/inputmask/phone-codes/phone.js"><script><scriptsrc="dist/inputmask/phone-codes/phone-be.js"><script><scriptsrc="dist/inputmask/phone-codes/phone-ru.js"><script>

If you like to automatically bind the inputmask to the inputs marked with the data-inputmask- … attributes you may also want to include the inputmask.binding.js

<scriptsrc="dist/inputmask/bindings/inputmask.binding.js"><script>

If you want to include the Inputmask and all extensions.

For individual extensions.
Every extension exports the Inputmask, so you only need to import the extensions.
See example.

By default the vanilla dependencyLib is used. You can select another dependency
by creating an alias in the webpack.config.

InputMask options

A masking pattern must be provided and must contain at least one editable character, or an will be thrown.

The following format characters define editable parts of the mask:

  • — number
  • — letter
  • — letter, forced to upper case when entered
  • — alphanumeric
  • — alphanumeric, forced to upper case when entered

If you need to include one of these characters as a static part of the mask, you can escape them with a preceding backslash:

var mask = new InputMask({pattern: '\\A11 \\1AA', value: 'A99 1ZZ'})
mask.getValue()
// → 'A99 1ZZ'

If you need to include a static backslash in a pattern, you must escape it:

var mask = new InputMask({pattern: '\\\\A11\\\\', value: 'Z98'})
mask.getValue()
// → '\\Z98\\'

Otherwise, all other characters are treated as static parts of the pattern.

Example patterns

  • Credit card number:
  • Date:
  • ISO date:
  • Time:
  • Canadian postal code:
  • Norn Iron license plate:

An object defining additional custom format characters to use in the mask’s pattern.

When defining a new format character, a function is required and a function can optionally be defined to modify the validated character before adding it to the mask’s value.

For example this is how you would define as a new format character which accepts word character input (alphanumeric or underscore) and forces it to lower case when entered:

var mask = new InputMask({
  pattern: 'Awwwww', // An uppercase letter followed by 5 word characters
  formatCharacters: {
    'w': {
      validate: function(char) { return \w.test(char) }
      transform: function(char) { return char.toLowerCase() }
    }
  }
})

To override a built-in format character, pass its character as a property of this object along with the new definition.

To disable a built-in format character, pass its character as a property of this object with a value:

var mask = new InputMask({
  pattern: 'A1111', // Treats the 'A' as static
  formatCharacters: {
    'A': null
  }
})

The character which is used to fill in editable slots for which there is no input yet when getting the mask’s current value.

Defaults to ; must be a single character.

var mask = new InputMask({pattern: '11/11/1111', placeholderChar: ' '})
mask.input('1')
// → true
mask.getValue()
// → '1 /  /    '

An optional initial value for the mask.

An optional default selection — defaults to , placing the cursor before the first character.

An optional property that, if true, progressively shows the mask as input is entered. Defaults to

Example:
Given an input with a mask of , a value of , and set to , then the input’s value is formatted as
Given the same input but with a value of , then the input’s value is formatted as
Given the same input but with a value of , then the input’s value is formatted as

Methods:

Create a mask for the input.

$(selector).inputmask({ mask"99-999-99"});

or

Inputmask({ mask"99-999-99"}).mask(document.querySelectorAll(selector));

or

Inputmask("99-999-99").mask(document.querySelectorAll(selector));

or

var im =newInputmask("99-999-99");im.mask(document.querySelectorAll(selector));

or

Inputmask("99-999-99").mask(selector);

Get the

$(selector).inputmask('unmaskedvalue');

or

var input =document.getElementById(selector);if(input.inputmask)input.inputmask.unmaskedvalue()

Unmask a given value against the mask.

var unformattedDate =Inputmask.unmask("23/03/1973",{ alias"dd/mm/yyyy"});

Remove the .

$(selector).inputmask('remove');

or

var input =document.getElementById(selector);if(input.inputmask)input.inputmask.remove()

or

Inputmask.remove(document.getElementById(selector));

return the default (empty) mask value

$(document).ready(function(){$("#test").inputmask("999-AAA");var initialValue =$("#test").inputmask("getemptymask");});

Check whether the returned value is masked or not; currently only works reliably when using jquery.val fn to retrieve the value

$(document).ready(function(){functionvalidateMaskedValue(val){}functionvalidateValue(val){}var val =$("#test").val();if($("#test").inputmask("hasMaskedValue"))validateMaskedValue(val);elsevalidateValue(val);});

Verify whether the current value is complete or not.

$(document).ready(function(){if($(selector).inputmask("isComplete")){}});

The metadata of the actual mask provided in the mask definitions can be obtained by calling getmetadata. If only a mask is provided the mask definition will be returned by the getmetadata.

$(selector).inputmask("getmetadata");

The setvalue functionality is to set a value to the inputmask like you would do with jQuery.val, BUT it will trigger the internal event used by the inputmask always, whatever the case. This is particular usefull when cloning an inputmask with jQuery.clone. Cloning an inputmask is not a fully functional clone. On the first event (mouseenter, focus, …) the inputmask can detect if it where cloned an can reactivate the masking. However when setting the value with jQuery.val there is none of the events triggered in that case. The setvalue functionality does this for you.

Get or set an option on an existing inputmask.
The option method is intented for adding extra options like callbacks, etc at a later time to the mask.

When extra options are set the mask is automatically reapplied, unless you pas true for the noremask argument.

Set an option

document.querySelector("#CellPhone").inputmask.option({onBeforePastefunction(pastedValue,opts){returnphoneNumOnPaste(pastedValue, opts);}});
$("#CellPhone").inputmask("option",{onBeforePastefunction(pastedValue,opts){returnphoneNumOnPaste(pastedValue, opts);}})

Instead of masking an input element it is also possible to use the inputmask for formatting given values. Think of formatting values to show in jqGrid or on other elements then inputs.

var formattedDate =Inputmask.format("2331973",{ alias"dd/mm/yyyy"});

Validate a given value against the mask.

var isValid =Inputmask.isValid("23/03/1973",{ alias"dd/mm/yyyy"});

InputMask history methods

An creates a new history snapshot each time you:

  • Perform a different type of editing operation to the previous editing operation.
  • Perform an editing operation with the cursor in a different position from where it was left after a previous editing operation.
  • Perform an editing operation with a text selection.

History methods allow you to step backwards and forwards through these snapshots, updating and accordingly.

If you perform an editing operation while stepping backwards through history snapshots, all snapshots after the current one will be disposed of.

A history method returns if a valid history operation was performed and and have been updated.

Otherwise, if an invalid history operation is attempted (e.g. trying to redo when you’ve already reached the point undoing started from) it will return .

Steps backwards through history snapshots.

Steps forwards through history snapshots.

Overview

This is a masked input plugin for the jQuery javascript library. It allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phone numbers, etc). It has been tested on Internet Explorer, Firefox, Safari, Opera, and Chrome. A mask is defined by a format made up of mask literals and mask definitions. Any character not in the definitions list below is considered a mask literal. Mask literals will be automatically entered for the user as they type and will not be able to be removed by the user.The following mask definitions are predefined:

  • a — Represents an alpha character (A-Z,a-z)
  • 9 — Represents a numeric character (0-9)
  • * — Represents an alphanumeric character (A-Z,a-z,0-9)

First, include the jQuery and masked input javascript files.

    npm install jquery-inputmask --dev    or    yarn add jquery-inputmask

Next, call the mask function for those items you wish to have masked.

jQuery(function($){   $("#date").mask("99/99/9999");   $("#phone").mask("(999) 999-9999");   $("#tin").mask("99-9999999");   $("#ssn").mask("999-99-9999");});

Optionally, if you are not satisfied with the underscore (‘_’) character as a placeholder, you may pass an optional argument to the maskedinput method.

jQuery(function($){   $("#product").mask("99/99/9999",{placeholder:" "});});

Optionally, if you would like to execute a function once the mask has been completed, you can specify that function as an optional argument to the maskedinput method.

jQuery(function($){   $("#product").mask("99/99/9999",{completed:function(){alert("You typed the following: "+this.val());}});});

Optionally, if you would like to disable the automatic discarding of the uncomplete input, you may pass an optional argument to the maskedinput method

jQuery(function($){   $("#product").mask("99/99/9999",{autoclear: false});});

You can now supply your own mask definitions.

jQuery(function($){   $.mask.definitions='';   $("#eyescript").mask("~9.99 ~9.99 999");});

You can have part of your mask be optional. Anything listed after ‘?’ within the mask is considered optional user input. The common example for this is phone number + optional extension.

jQuery(function($){   $("#phone").mask("(999) 999-9999? x99999");});

If your requirements aren’t met by the predefined placeholders, you can always add your own. For example, maybe you need a mask to only allow hexadecimal characters. You can add your own definition for a placeholder, say ‘h’, like so: Then you can use that to mask for something like css colors in hex with a .

jQuery(function($){   $("#phone").mask("#hhhhhh");});

By design, this plugin will reject input which doesn’t complete the mask. You can bypass this by using a ‘?’ character at the position where you would like to consider input optional. For example, a mask of «(999) 999-9999? x99999» would require only the first 10 digits of a phone number with extension being optional.

Методы:

mask(elems)

Создание маски ввода

$(selector).inputmask({ mask: "99-999-99"});

или

Inputmask({ mask: "99-999-99"}).mask(document.querySelectorAll(selector));

или

Inputmask("99-999-99").mask(document.querySelectorAll(selector));

или

var im : new Inputmask("99-999-99");
im.mask(document.querySelectorAll(selector));

или

Inputmask("99-999-99").mask(selector);

unmaskedvalue

Get the

$(selector).inputmask('unmaskedvalue');

или

var input = document.getElementById(selector);
if (input.inputmask)
  input.inputmask.unmaskedvalue()

Value unmasking

Unmask a given value against the mask.

var unformattedDate = Inputmask.unmask("23/03/1973", { alias: "dd/mm/yyyy"}); //23031973

удаление

Удаление .

$(selector).inputmask('remove');

или

var input = document.getElementById(selector);
if (input.inputmask)
  input.inputmask.remove()

или

Inputmask.remove(document.getElementById(selector));

getemptymask

return the default (empty) mask value

$(document).ready(function(){
  $("#test").inputmask("999-AAA");
  var initialValue = $("#test").inputmask("getemptymask");  // initialValue  => "___-___"
});

hasMaskedValue

Проверьте маскируется ли возвращаемое значение или нет; В настоящее время только надежно работает при использовании jquery.val функции для извлечения значения

$(document).ready(function(){
  function validateMaskedValue(val){}
  function validateValue(val){}

  var val = $("#test").val();
  if ($("#test").inputmask("hasMaskedValue"))
    validateMaskedValue(val);
  else
    validateValue(val);
});

isComplete

Проверяет, осуществлен ли полный ввод значения или нет

$(document).ready(function(){
  if ($(selector).inputmask("isComplete")){
    //do something
  }
});

getmetadata

Метаданные фактической маски, представленной в определениях маски может быть получено с помощью вызова getmetadata. Если только маска при условии определения маски будет возвращен getmetadata.

$(selector).inputmask("getmetadata");

установка значения

SetValue функциональность, чтобы установить значение для inputmask, как вы могли бы сделать с jQuery.val, но это вызовет внутреннее событие, используемый inputmask всегда, в любом случае. Это особенно полезно при клонировании inputmask с jQuery.clone. Клонирование inputmask не является полностью функциональным клоном. На первом случае (MouseEnter, фокус …) сотрудник inputmask может обнаружить, если он где клонировали может активировать маскирование. Однако при установке значения с jQuery.val не существует ни одно из событий сработавших в этом случае. SetValue функциональность делает это для вас.

option(options, noremask)

Get or set an option on an existing inputmask.
The option method is intented for adding extra options like callbacks, etc at a later time to the mask.

When extra options are set the mask is automatically reapplied, unless you pas true for the noremask argument.

Set an option

document.querySelector("#CellPhone").inputmask.option({
  onBeforePaste: function (pastedValue, opts) {
    return phoneNumOnPaste(pastedValue, opts);
  }
});
$("#CellPhone").inputmask("option", {
  onBeforePaste: function (pastedValue, opts) {
    return phoneNumOnPaste(pastedValue, opts);
  }
})

Формат

Вместо того, чтобы маскировать входного элемента также можно использовать для форматирования inputmask для форматирования заданных значений. Подумайте о форматировании значений, чтобы показать в jqGrid или на других элементах затем вводит.

var formattedDate = Inputmask.format("2331973", { alias: "dd/mm/yyyy"});
var isValid = Inputmask.isValid("23/03/1973", { alias: "dd/mm/yyyy"});

Properties

Name Type Default
disabled Boolean false

Sets or gets whether the widget is disabled.

$('#jqxMaskedInput').jqxMaskedInput({ disabled: true});

Get the property.

Try it: disabled is set to true

height Number/String null

Sets or gets height of the masked input in pixels.

$('#jqxMaskedInput').jqxMaskedInput({ height: '25px'});

Get the property.

Try it: height is set to ’25px’

mask String ‘#####’

Sets or gets the masked input’s mask.

Mask characters:

  • # — For digit character. Accepts values from 0 to 9
  • 9 — For digit character. Accepts values from 0 to 9
  • 0 — For digit character. Accepts values from 0 to 9
  • A — For alpha numeric character. Accepts values from 0 to 9 and from a to z and A to Z.
  • L — For alpha character. Accepts values from a to z and A to Z
  • — For character set. Matches any one of the enclosed characters. You can specify a range of characters by using a hyphen. For example, is the same as .
    Examples: — accepts values from 0 to 5. — accepts only a or b.

Get the property.

Try it: mask is set to ‘###-##-####’

promptChar String «_»

Sets or gets the prompt char displayed when an editable char is empty.

$('#jqxMaskedInput').jqxMaskedInput({ promptChar: "." });

Get the property.

Try it: promptChar is set to «#»

readOnly Boolean false

Sets or gets the readOnly state of the input.

$('#jqxMaskedInput').jqxMaskedInput({ readOnly: true });

Get the property.

Try it: readOnly is set to true

rtl Boolean false

Sets or gets a value indicating whether widget’s elements are aligned to support locales using right-to-left fonts.

Get the property.

Try it: rtl is set to true

theme String »

Sets the widget’s theme.

jQWidgets uses a pair of css files — jqx.base.css and jqx..css. The base stylesheet creates the styles related to the widget’s layout like margin, padding, border-width, position. The second css file applies the widget’s colors and backgrounds. The jqx.base.css should be included before the second CSS file.
In order to set a theme, you need to do the following:

  • Include the theme’s CSS file after jqx.base.css.
    The following code example adds the ‘energyblue’ theme.

  • Set the widget’s theme property to ‘energyblue’ when you initialize it.

Try it: theme is set to ‘energyblue’

textAlign String left

Sets or gets the text alignment.

Possible Values:

Initialize a MaskedInput with the property specified.

$('#jqxMaskedInput').jqxMaskedInput({ textAlign: "right"});

Get the property.

Try it: textAlign is set to ‘right’

value String null

Sets or gets the masked input’s value.

Get the property.

Try it: value is set to 300

width Number/String null

Sets or gets width of the masked input in pixels. Only positive values have effect.

$('#jqxMaskedInput').jqxMaskedInput({ width: '250px'});

Get the property.

Try it: width is set to ‘250px’

change Event

This event is triggered when the value is changed and the control’s focus is lost.

Bind to the event by type: jqxMaskedInput.

Try it: Bind to the change event by type:jqxMaskedInput

valueChanged Event

This event is triggered when the value is changed.

Bind to the event by type: jqxMaskedInput.

Try it: Bind to the valueChanged event by type:jqxMaskedInput

clear Method

Clears the value.

Parameter Type Description
None

Return ValueNone

Invoke the method.

Try it: clears the jqxMaskedInput

destroy Method

Destroys the widget.

Parameter Type Description
None

Return ValueNone

Invoke the method.

Try it: destroys the jqxMaskedInput

focus Method

Focuses the widget.

Parameter Type Description
None

Return ValueNone

Invoke the method.

Try it: focuses the jqxMaskedInput

val Method

Sets or gets the value.

Parameter Type Description
value String

Return ValueString

Get the value using the val method.

// Get the value using jQuery’s val.

Set the value using the val method.

// Set the value using jQuery’s val.

Try it: sets the value of the jqxMaskedInput

Usage:

Include the js-files which you can find in the dist-folder. You have the bundled file which contains the main plugin code and also all extensions. (date, numerics, other) or if you prefer to only include some parts, use the separate js-files in the dist/min folder.

The minimum to include is the jquery.inputmask.js

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.inputmask.js" type="text/javascript"></script>

Define your masks:

$(document).ready(function(){
   $("#date").inputmask("d/m/y");  //direct mask
   $("#phone").inputmask("mask", {"mask": "(999) 999-9999"}); //specifying fn & options
   $("#tin").inputmask({"mask": "99-9999999"}); //specifying options only
});

or

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false" />
<input data-inputmask="'mask': '99-9999999'" />
$(document).ready(function(){
    $(":input").inputmask();
});

Default masking definitions

  • 9 : numeric
  • a : alfabetic

There are more definitions defined within the extensions.
You can find info within the js-files or by further exploring the options.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Adblock
detector