Hi @pickme,
You can try something using the example below.
<script type="text/javascript">
jQuery(document).ready(function($) {
$("input[name='INPUT_NAME']").mask("(000) 000-0000", {
reverse: false,
onComplete: function(val) {
$("input[name='INPUT_NAME']").removeClass('INVALID_CLASS_NAME');
},
onChange: function(val) {
$("input[name='INPUT_NAME']").removeClass('INVALID_CLASS_NAME');
},
onInvalid: function(val, e, f, invalid, options) {
$("input[name='INPUT_NAME']").addClass('INVALID_CLASS_NAME');
}
});
});
</script>
More details: click here
Hi @pickme,
Did this solution work for you?
Thread Starter
pickme
(@pickme)
Hi @ivanpetermann
I will try again and I will let you know. Initially I did not make it to work.
Thanks
Thread Starter
pickme
(@pickme)
Hello @ivanpetermann ,
With mask “0000” the code below works. However, I tried to change the mask pattern but actions removeClass and addClass do not work. The code I use is this:
function validation_colors() {
?>
<script type="text/javascript">
jQuery(document).ready(function($) {
$("input[type='text']").mask('A', {translation: {'A': {pattern: /[a-zA-Z0-9]/, recursive: true}}}, {
reverse: false,
onComplete: function(val) {
$("div.fieldset-job_title > div.field-head > label").removeClass("invalid-text").addClass("valid-text");
},
onChange: function(val) {
$("div.fieldset-job_title > div.field-head > label").removeClass("invalid-text").addClass("valid-text");
},
onInvalid: function(val, e, f, invalid, options) {
$("div.fieldset-job_title > div.field-head > label").removeClass("valid-text").addClass("invalid-text");
}
});
});
</script>
<?php
}
add_action('wp_footer', 'validation_colors', 10);
Could you please help me find out what is wrong with the pattern ‘A’ that works, but the classes that do not?
Thank you
-
This reply was modified 3 months, 1 week ago by
pickme.
-
This reply was modified 3 months, 1 week ago by
pickme.
Hi @pickme,
Try with this code.
function validation_colors() {
?>
<script type="text/javascript">
jQuery(document).ready(function($) {
$("input[type='text']").mask('A', {
translation: { 'A': { pattern: /[a-zA-Z0-9]/, recursive: true } },
reverse: false,
onComplete: function(val) {
$("div.fieldset-job_title > div.field-head > label").removeClass("invalid-text").addClass("valid-text");
},
onChange: function(val) {
$("div.fieldset-job_title > div.field-head > label").removeClass("invalid-text").addClass("valid-text");
},
onInvalid: function(val, e, f, invalid, options) {
$("div.fieldset-job_title > div.field-head > label").removeClass("valid-text").addClass("invalid-text");
}
});
});
</script>
<?php
}
add_action('wp_footer', 'validation_colors', 10);