javascript?

[dezkit]

is there a code that i can do so if a person submits non-numerical text in a input, it shows an error?

[bibby]

yup.

Though if you want javascript to do this, it would happen when the user tries to submit, and wouldn't be allowed to if there is an error.

 

First,  stop the form from submitting like normal by overriding it's onsubmit.

 

<form name="foo" onsubmit="checkForm(); return false;">
<input type="text" size="8" name="num" />
<input type="submit" />
</form>

 

Next, you can make the checkForm function that will validate the input and submit the form itself or not.

 

<script language="javascript" type="text/javascript">
function checkForm()
{
var v = document.foo.num.value;
if( v.match('([^0-9]+)') != null || v=='')
{
	alert('value must be a number');
	return false;
}
else
{
	document.foo.submit();
}
}
</script>

 

String.match takes a regular expression, and makes an array of matching text. In this case, v.match is looking for "anything not whole number". It's up to you to allow negative or floating point numbers: match('([^0-9\.-]+)') if you do. If no match is found, it returns null , meaning it is numeric and can be submitted.

 

RegEx is preferable (to me) over parseInt or (+v) , because .value is a string no matter what its contents. Hope this helps.

[Psycho]

If I may, abetter alternative is to use "return someFunction()" within the onsubmit trigger. That way the validation script only returns true/false. This allows you to make your code more transportable. You aslo don't state whether the value must be numeric OR if it can only be digits (e.g. 1.2 is a numeric value, but is not all numbers). You aslo don't state if the value can be empty.

 

I also prefer to have a validatin script that then calls sub-functions for each type of validation. That way you can easily run the same validation on multiple values without rewriting a lot of code.

 

<form name="foo" onsubmit="return checkForm();">
<input type="text" size="8" name="num" />
<input type="submit" />
</form>

 

<script language="javascript" type="text/javascript">

function isNum(value) {
    //Validate that it is not NULL and is all number characters
    return (value && !value.match(/[^0-9]/));

    //Validate that it is not NULL and is a numeric value
//    return (value && !isNaN(value));
}


function checkForm(value)
{
    //Check each field
    var value = document.foo.num.value;
    if (!isNum(value)) {
        alert('value must be a number');
        document.foo.num.focus();
        document.foo.num.select();
        return false;
    }

    //Add additional validations as needed
    //Return false if any fail


    //If all validations pass return true
    return true;
}
</script>