Validate input text field and clear if invalid

[backups2007]

I have this javascript validation code that I want to be able to clear an input text box when the inputed value is invalid.

Note: this is a reusable validation code.

function isChar(form1)
{
    var letters = "ABCDEFGHIJKLMNÑOPQRSTUVWXYZabcdefghijklmnñopqrstuvwxyz";
    var strChar;
    var dig = true;
 
    if (form1.length == 0) return false;
 
    for (a = 0; a < form1.length && dig == true; a++)
    {
        strChar = form1.charAt(a);
        if (letters.indexOf(strChar) == -1)
        {
            dig=false;
            alert("Invalid Input! Try Again.");
            this.focus();
        }
        return dig;
    }
}

Replies are very much appreciated. Thanks.

[mrhoo]

Use a regular expression to test the whole input value at once-

function isChar(field){
    if(/^[a-zñ]+$/i.test(field.value)) return true;
    field.value= '';
    alert("Invalid Input! Try Again.");
 
    setTimeout(function(){field.focus()},10);
// you need the timeout, or the alert steals the focus
 
    return false;
}

[hsriat]

Or use /^[a-zñÑ]+$/i in line 2 in the code by mrhoo, just in case it misses Ñ.

Not sure, but may be it won't consider Ñ as upper case of ñ.

[mrhoo]

Not sure, but may be it won't consider Ñ as upper case of ñ

It seems to work, but it may depend on the character set in use- probably best to use hsriat's version.

[backups2007]

Use a regular expression to test the whole input value at once-

function isChar(field){
    if(/^[a-zñ]+$/i.test(field.value)) return true;
    field.value= '';
    alert("Invalid Input! Try Again.");
 
    setTimeout(function(){field.focus()},10);
// you need the timeout, or the alert steals the focus
 
    return false;
}

this code does seem like it is only for 1 field. the code that I posted is a reusable code. how can your code be converted so that it can be applicable to any textbox?

[hsriat]

this code does seem like it is only for 1 field. the code that I posted is a reusable code. how can your code be converted so that it can be applicable to any textbox?

What do you exactly mean here by Reusable? How can say a code is reusable or not considering a small snippet of code?

Well, if you want this to validate all the inputs of a form, then make another function and call this isChar function in that, for each input of the form. Got it?

function isChar(field) {
    if(/^[a-zñÑ]+$/i.test(field.value)) return true;
    return false;
}

And there is no need to do settimeout for focus. Alert won't steal anything. He's not a thief. :D
Just replace it with with field.focus()

[backups2007]

What do you exactly mean here by Reusable? How can say a code is reusable or not considering a small snippet of code?

Well, if you want this to validate all the inputs of a form, then make another function and call this isChar function in that, for each input of the form. Got it?

function isChar(field) {
    if(/^[a-zñÑ]+$/i.test(field.value)) return true;
    return false;
}

And there is no need to do settimeout for focus. Alert won't steal anything. He's not a thief. :D
Just replace it with with field.focus()

I want to use the code to validate all inputs of a form and be able to reuse it in other forms.

[hsriat]

I want to use the code to validate all inputs of a form and be able to reuse it in other forms.

so it is... just call it in a loop for all the inputs of a form.

function validateForm(f) {
    var ele = document.forms[f].elements;
    var allValid = true;
    for (var i in ele)
    if (!isChar(ele[i]) && ele[i].type!="radio" && ele[i].type!="checkbox") {
        allValid = false;
        ele[i].style.borderColor = "red";
    }
    return allValid;
}