...

View Full Version : Validate all textboxes to be numeric



scrupul0us
02-05-2007, 05:50 PM
I have a varying number of text boxes on a page... i want to validate that they all contain only 0-9 (numeric) and if so allow the form to submit

thanks!

chump2877
02-05-2007, 06:17 PM
try:


<form name='form1' method='post' action='file.php' onsubmit="return validate(document.form1);">
<input type='text' name='field1' />
<input type="submit" name="submit" value="submit" />
</form>

<script type="text/javascript">

function validate(formObj)
{
regex = /^\d+\.*\d*$/;
if (!regex.test(formObj.field1.value))
{
alert('textbox does not contain a number');
return false;
}
else
{
return true;
}
}

</script>

scrupul0us
02-05-2007, 06:20 PM
well while that looks like it might validate one textbox im sure theres a way to validate the DOM array that holds all of the textboxes... i just dont know how to do that and cant hardcode this since there are varying number of textboxes

chump2877
02-05-2007, 06:44 PM
give that a shot then...note: I'm not validating for anything other than numeric values in the textboxes....this also requires that the "submit" input be the very last input node in your form:



<form name='form1' method='post' action='file.php' onsubmit="return validate(document.form1);">
<input type='text' name='field1' /><br />
<input type='text' name='field2' /><br />
<input type='text' name='field3' /><br />
<input type='text' name='field4' /><br />
<input type="submit" name="submit" value="submit" />
</form>
<script type="text/javascript">
function validate(formObj)
{
var inputArr = formObj.getElementsByTagName('input');
var regex = /^[0-9]+$/;
for (i=0; i<inputArr.length - 1; i++)
{
if (!regex.test(inputArr[i].value))
{
alert('textbox does not contain a number');
inputArr[i].select();
return false;
}
}
return true;
}
</script>

scrupul0us
02-05-2007, 07:09 PM
that pretty snappy!

would it be possible to change the background-color: property of the offending text box after calling select with something like this:



inputArr[i].style.backgroundcolor='red';


which doesnt work ;)

otaku149
02-05-2007, 08:04 PM
C of backgroundColor must be uppercase:

inputArr[i].style.backgroundColor='red';

chump2877
02-05-2007, 08:38 PM
<form name='form1' method='post' action='file.php' onsubmit="return validate(document.form1);">
<input type='text' name='field1' /><br />
<input type='text' name='field2' /><br />
<input type='text' name='field3' /><br />
<input type='text' name='field4' /><br />
<input type="submit" name="submit" value="submit" />
</form>
<script type="text/javascript">
function validate(formObj)
{
var inputArr = formObj.getElementsByTagName('input');
var regex = /^[0-9]+$/;
for (i=0; i<inputArr.length - 1; i++)
{
if (inputArr[i].style.backgroundColor=='red')
inputArr[i].style.backgroundColor='';
}
for (i=0; i<inputArr.length - 1; i++)
{
if (!regex.test(inputArr[i].value))
{
alert('textbox does not contain a number');
inputArr[i].select();
inputArr[i].style.backgroundColor='red';
return false;
}
}
return true;
}
</script>

scrupul0us
02-05-2007, 08:57 PM
hrm... in firefox at least that doesnt work

chump2877
02-05-2007, 09:01 PM
Works great for me in IE and Firefox...

But the selection color in firefox certainly doesn;t complement a background color of red...

But you get what you ask for :)

scrupul0us
02-05-2007, 09:11 PM
hrm.. it does seem to work now.... thinking i forgot to save in jedit ;)

much obliged!

fortunately i do not have a red BG color for the page ;)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum