For a phone validation I am using in prototype.js a …
<body onload="Xaprb.InputMask.setupElementMasks()">
That is actually an older version (1.4) and an upgrade to (1.7) would not work. Here is the code placed into the page…
<script type="text/javascript" language="javascript">
//<![CDATA[
if ( typeof(Xaprb) == 'undefined' ) {
Xaprb = new Object();
}
Xaprb.InputMask = {
masks: {
phone: {
format: '( ) - ',
regex: /\d/
}
},
setupElementMasks: function() {
if ( document.getElementsByClassName ) { // Requires the Prototype library
document.getElementsByClassName('input_mask').each(function(item) {
Event.observe(item, 'keypress',
Xaprb.InputMask.applyMask.bindAsEventListener(item), true);
});
}
},
applyMask: function(event) {
var match = /mask_(\w+)/.exec(this.className);
if ( match.length == 2 && Xaprb.InputMask.masks[match[1]] ) {
var mask = Xaprb.InputMask.masks[match[1]];
var key = Xaprb.InputMask.getKey(event);
if ( Xaprb.InputMask.isPrintable(key) ) {
var ch = String.fromCharCode(key);
var str = this.value + ch;
var pos = str.length;
if ( mask.regex.test(ch) && pos <= mask.format.length ) {
if ( mask.format.charAt(pos - 1) != ' ' ) {
str = this.value + mask.format.charAt(pos - 1) + ch;
}
this.value = str;
}
Event.stop(event);
}
}
},
isPrintable: function(key) {
return ( key >= 32 && key < 127 );
},
getKey: function(e) {
return window.event ? window.event.keyCode
: e ? e.which
: 0;
}
};
//]]>
</script>
Forgive me but I am fairly new to this subject if missing something simple. It basically validates the phone number as the customer types it in. This is located a http://www.comparediabetictestingsupplies.com and actually forces the sliders through jreviews not function (this is a Joomla! CMS). I also want to add, I changed all 75 ‘$’ to ‘_’ in prototype.js.
I ended up finding prototype.maskedinput.js that works with the prototype.js 1.6.1. This ended up changing the code around, but solved not only a conflict with jquery, but also mootools. You can find the source at https://github.com/bjartekv/MaskedInput/blob/master/prototype.maskedinput.js