jQuery-Mask-Plugin
jQuery-Mask-Plugin copied to clipboard
Mask pattern error add class valid or invalid
Hello friends, Hello el patron,
I want to add a class when an error occurs.
I give examples;
my mask:
$('.mask-gsm').mask('Z(500) 000 0000', {
"placeholder": "0(5__) ___ ____",
translation: {
'Z': {
pattern: /[0]/,
optional: true
}
},
};
my input value:
0(555)123 4567 (555)123 4567 class="valid" will be added as in the example above.
0(555)123 0(555)123 45 (555)123 45 class="invalid" will be added as in the example above.
this is what i want to do:
if(mask REGEX OR PATTERN == true) {
$(this).addClass('valid');
} else {
$(this).addClass('invalid');
}
I found a solution. But the solution I found is not very useful.
So it's not programmable. But it worked as I wanted.
/** mask-gsm */
$('.mask-gsm').mask('Z(500) 000 0000', {
"placeholder": "0(5__) ___ ____",
translation: {
'Z': {
pattern: /[0]/,
optional: true
}
},
onChange: function(value, event, currentField, options) {
// eger kutudaki deger asagidaki MATCH ile ayni ise .valid sınıfını ekle
if (value.match(/0?\([0-9]{3}\) [0-9]{3} [0-9]{4}/) & currentField.attr('data-mask-style') != "false" ) {
$(currentField).removeClass('error');
$(currentField).addClass('valid');
}
}
});
// eger kutudan imlec cikiyor ise ve MATCH ile ayni değil ise .error sınıfını ekle
$('.mask-gsm').blur(function() {
if (!$(this).val().match(/0?\([0-9]{3}\) [0-9]{3} [0-9]{4}/) & $(this).attr('data-mask-style') != "false") {
$(this).removeClass('valid');
$(this).addClass('error');
}
});
I was trying to use the callback "onInvalid" to do it, but it seems doesn't work..