AllowedSymbols: Array
The AllowedSymbols property sets an array of symbols allowed to input in the editor.
Use JSON or the setAllowedSymbols method to set the property value and the getAllowedSymbols method to get the property value.
To execute the example, the HTML page must contain links to the PP.js script file and the PP.css style file in the <body> tag of the <div> item HTML page with the maskEdit identifier. Create an instance of the MaskEdit component and add a handler of the KeyPress and ValueChanged events:
function createMaskEdit() {
// Create an input editor
maskEdit = new PP.Ui.MaskEdit({
// Set parent item
ParentNode: document.getElementById("maskEdit"),
// Set an array of authorized characters
AllowedSymbols: ["0", "1", "2", "3", "4", "5"],
// Set an event handler of input editor value changing
ValueChanged: function (sender, args) {
console.log("Value of input ediitor is changed");
}
});
// Set a step of value changing
maskEdit.setStep(1);
// Set an event handler of the key clicking
maskEdit.KeyPress.add(function (sender, args) {
// Check whether inputted character is authorized
if (contains(this._AllowedSymbols, args.Event.charCode)) {
// After authorized character is inputted, the style for available values will be set for input editor
this.applyValidCSS();
} else {
// After illegal character is inputted, the style for invalid values will be set for input editor
this.applyNotValidCSS();
}
});
}
// Audit function whether the character enters in the array
function contains(arr, codeSymbol) {
var i = 0;
while (arr[i] != undefined) {
if (arr[i].charCodeAt(0) == codeSymbol) {
return true;
}
i++;
}
return false;
}
Input the 0 character in input editor. The character is inputted because it is authorized and the input editor implements the style for available characters:
The console displays a message about input editor value changing:
Input editor value is changed
Input the 6 character in input editor. The character is not inputted because it is not authorized and the input editor implements the style for unavailable characters:
See also: