How to restrict a field to accept first 2 char. as alphabets and last 5 numbers

[KS13]

Yesterday, a solution was provided for the same question, but after the error message was closed, it still allowed the user to submit with the inaccurate format. 

Have written the following script and still not working:

function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == '') {
return;
}

var rexp = '/^[a-zA-Z]{2}[0-9]{5}]$/';   
var dataValue=g_form.getValue('provide_id');

if (dataValue.match(rexp)==null){
alert('The new  ID format does match the ID format.');
g_form.clearValue('provide_id');
g_form.showFieldMsg('provide_id', 'The new  ID format does match the ID format.', 'info', true);
} else {
g_form.clearMessages();
}
}

[Community Alums]

Ahhh... I see now - it's a much simpler use case that I though it is 🙂

Either fix the regex or use similar approach as I posted if you want every single key stroke to be tested if valid - char 1 - alpha, char 2 - alpha, char 3 to 5 - digit. If you type for example at char 2 (expected alpha) digit, you can have alert explainigg that, removing the bad entry (while keeping the previous ones) and allow the user to enter valid data.

Something like this :

function onLoad() {

var control = g_form.getControl('description');

Event.observe(control, 'input', function(e) {

    var oldInputVal = e.target.defaultValue;

    var newInputVal = e.target.value;

    var regexLastChars = /\d{5}$/gm;

    var regexMandatoryChars = /^[a-zA-Z]{2}/gm;

    var oldInput = (function () {           

        var i = oldInputVal;

        return {

            get: function () {

                return i;

            },

            set: function (val) {

                i = val;

            }

        };

    })();

    var userVal = newInputVal;///.replace(regexSpecialChars, "");

    if(newInputVal.length == 2){

    if(!regexMandatoryChars.test(userVal)){

        alert("NOT A CHARACTER " + userVal);

        userVal = userVal.replace(/.*/, "");

    } 

    } else if(newInputVal.length == 7){

        if(!regexLastChars.test(userVal)){

        alert("NOT A NUMBER " + userVal);

        userVal = userVal.replace(/.{5}$/, "");

    } 

    } else if(newInputVal.length > 7){

        userVal = userVal.replace(/.$/, "");

        alert("No more chars allowed!")

    }

    oldInput.set(userVal);      

    g_form.setValue('description', oldInput.get());

});

}

[KS13]

Unfortunately it is not working accurately. 

[Community Alums · Accepted solution]

What is the issue ? I havent adjusted is fully for your use case - you can check if the first input keystroke is alphabetic, if second is alphabetic, is third is numeric, etc.

Try this (I tested it on my PDI for several use cases - allows input if, first & second input is character, 3-5 are numbers. If > 7 - error)

function onLoad() {

var control = g_form.getControl('provide_id');
Event.observe(control, 'input', function(e) {

var oldInputVal = e.target.defaultValue;
var newInputVal = e.target.value;
var regexMandatoryChars = /^[a-zA-Z]{2}/gm;
var regexLastChars = /\d{5}$/gm;
var regex1Char = /[a-zA-Z]$/gm;
var regex2Char = /[a-zA-Z]$/gm;
var regex3Char = /\d$/gm;
var regex4Char = /\d/gm;
var regex5Char = /\d/gm;
var regex6Char = /\d/gm;
var regex7Char = /\d/gm;

var oldInput = (function () {
var i = oldInputVal;

return {
get: function () {
return i;
},
set: function (val) {

i = val;
}
};
})();

var userVal = newInputVal;///.replace(regexSpecialChars, "");

if(userVal.length == 1){
if(!regex1Char.test(userVal)){
alert("First two characters must be alphabetical! You typed " + userVal + ", type an alphabetical character instead!");
userVal = userVal.replace(/.$/, "");
}
} else if(userVal.length == 2){

if(!regex2Char.test(userVal)){
alert("First two characters must be alphabetical! You typed " + userVal + ", type an alphabetical character as a second one instead!");
userVal = userVal.replace(/.$/, "");
}

} else if(userVal.length == 3){
if(!regex3Char.test(userVal)){
alert("Last 5 characters must be numeric. " + userVal + " is not a number!");
userVal = userVal.replace(/.$/, "");
}
} if(userVal.length == 4){
if(!regex3Char.test(userVal)){
alert("Last 5 characters must be numeric. " + userVal + " is not a number!");
userVal = userVal.replace(/.$/, "");
}
} if(userVal.length == 5){
if(!regex3Char.test(userVal)){
alert("Last 5 characters must be numeric. " + userVal + " is not a number!");
userVal = userVal.replace(/.$/, "");
}
} if(userVal.length == 6){
if(!regex3Char.test(userVal)){
alert("Last 5 characters must be numeric. " + userVal + " is not a number!");
userVal = userVal.replace(/.$/, "");
}
} if(userVal.length == 7){
if(!regex3Char.test(userVal)){
alert("Last 5 characters must be numeric. " + userVal + " is not a number!");
userVal = userVal.replace(/.$/, "");
}
} if(userVal.length > 7){
userVal = userVal.replace(/.$/, "");
alert("Allowed lenght [2 characters and 5 numbers] reached. No more characters allowed!");
}
oldInput.set(userVal);
g_form.setValue('provide_id', oldInput.get());

});

}