Looping in javascript: form validation

scroce · Aug 9, 2002

I have a form with several textboxes. They are all named txtNumClaims1, txtNumClaims2, txtNumClaims3, .........txtNumClaims12 and they all hold numbers. I wrote a function called isItNumber() to check for the presence of a number.

I think I can use a "for" to loop through each of the txtboxes to check for validation, can't I? The code below is incorrect, but I think it will give you the idea of what I'm trying to accomplish. Can someone help me?

function formValidation() {

var currentForm

currentForm=document.frmChart
for (var boxCount = 1; j < 12; boxCount++) {

if (isItNumber(currentForm.txtNumClaims+boxCount) == false) {
alert("Please enter a number.);
currentForm.txtNumClaims+boxCount.focus();
return false;
}
}

i.e. i'm trying to concatenate the boxCount variable to the end of the name of the textbox I'm evaluating instead of writing that block of code twelve times.

Any help is much appreciated.
Seek not outside yourself; heaven is within.

Discord · Aug 9, 2002

try

Code:

for (var boxCount = 1; j < 12; boxCount++)
{
    eval('ClaimsBox = currentForm.txtNumClaims'+boxCount);
    if (isItNumber(ClaimsBox) == false) {
      alert(&quot;Please enter a number.);
      ClaimsBox.focus();
    return false;
    }
}

scroce · Aug 9, 2002

It does seem like that should work - although I still can't seem to get it right. In this line, are you sure there should be single quotes? I tried them with and without, but neither seemed to work.

eval('ClaimsBox = currentForm.txtNumClaims'+boxCount); Seek not outside yourself; heaven is within.

Discord · Aug 9, 2002

either single or double quotes should work fine. what error are you getting? what is the isItNumber function expecting? the form element or the form element's value? the above code passes the form element.

scroce · Aug 9, 2002

No error occurs, the form just gets submitted when it shouldn't be. The isItNumber is expecting the form element - here's the code for that:

//this function tests for an empty and then makes sure whatever is entered is a number.

function isItNumber(elm) {
if (elm.value =="&quot

{
return false;
}

for (var i=0; i < elm.value.length; i++) {
if (elm.value.charAt(i) < "0" || elm.value.charAt(i) > "9&quot

{
return false;
}
}
} Seek not outside yourself; heaven is within.

Discord · Aug 9, 2002

ok. try
for (var boxCount = 1; j < 12; boxCount++)
{
eval('ClaimsBox = currentForm.txtNumClaims'+boxCount);
if (isNaN(Number(ClaimsBox.value))) {
alert("Please enter a number.);
ClaimsBox.focus();
return false;
}
}

scroce · Aug 9, 2002

Nope - it still seems to pass it right thru: two things.

1. there is a slight error in the for statement, it should read

for (var boxCount = 1; boxCount < 12; boxCount++) NOT
for (var boxCount = 1; j < 12; boxCount++)

right?

I had caught that error before - so that's not what's causing it.

Also, why do you need eval at all? can't you just say this:

for (var boxCount = 1; boxCount < 12; boxCount++)
{
claimsBox = currentForm.txtNumClaims + boxCount

if (isNaN(Number(claimsBox.value)) {
alert("Please enter a number.&quot

;
claimsBox.focus();
return false;
}
}

This is the last code I tried (unsuccessfully):

for (var boxCount = 1; boxCount < 12; boxCount++)
{
eval(claimsBox = currentForm.txtNumClaims + boxCount);
if (isNaN(Number(claimsBox.value)) {
alert("Please enter a number.&quot

;
claimsBox.focus();
return false;
}
}

I also tried it with the ' and the " where you mentioned. It just let my form process when it should have stopped it.

I'll keep fiddling with it - this code is probably right, it's just something else keeping it from going.

Is the problem with the concatenation? Seek not outside yourself; heaven is within.

Discord · Aug 9, 2002

do you have a link to the page i can see? i am very confused as to why what i wrote isn't working

scroce · Aug 13, 2002

I don't have it hosted outside yet - but I'll post back if i can get you a link in a reasonable amount of time. Seek not outside yourself; heaven is within.

trollacious · Aug 13, 2002

Try:

claimsBox = currentForm.elements['txtNumClaims' + boxCount];

scroce · Aug 13, 2002

it's still not working. I just don't understand why. Could it be due to the fact that the form is being generated by asp code rather than in plain html? Seek not outside yourself; heaven is within.

Discord · Aug 13, 2002

that shouldn't matter. how big is the generated HTML file? would you be able to post it here?

scroce · Aug 13, 2002

OK here's my entire mess of a page. I hope it's not too unclear. Thanks for giving it a shot. I'll hi-lite what I think are the relevant lines[/red]

<html>
<script Language="JavaScript">

//this function tests for an empty and then makes sure whatever is entered is a number.
function isItNumber(elm) {
if (elm.value =="&quot

{
return false;
}

for (var i=0; i < elm.value.length; i++) {
if (elm.value.charAt(i) < "0" || elm.value.charAt(i) > "9&quot

{
return false;
}
}
}

//This is the main portion of the function - it incorporates all of the other functions
//outlined above and uses them on the text/combo boxes on the form before it is submitted.

function formValidation() {

var currentForm
var claimsBox
//var boxCount

currentForm=document.frmChart

//This is my unsuccessfull attempt to shorten the code using a FOR:

//for (var boxCount = 1; boxCount < 5; boxCount++)
//{
// claimsBox = eval(currentForm.txtNumClaims+boxCount);
//// eval(ClaimsBox = currentForm.txtNumClaims+boxCount);
// if (isItNumber(claimsBox) == false) {
// alert("Please enter a number.&quot

;
// claimsBox.focus();
// return false;
// }
//}

for (var boxCount = 1; boxCount < 12; boxCount++)
{

claimsBox = currentForm.elements['txtNumClaims' + boxCount];
if (isNaN(claimsBox.value))) {
alert("Please enter a number.&quot

;
claimsBox.focus();
return false;
}
}

//claimsBox = currentForm.elements['txtNumClaims' + boxCount];
//=======================================================================================================

</script>
<head>
<title>PoolPact Claims Chart Admin Page</title>
</head>

<body background="../Images/back.gif">
<%
'==============================================
'Troubleshoot Session Variables
'==============================================
'If session("ValidUser&quot

="" then
' Response.Write ("Nothing in the variable&quot

'else
'Response.Write (session("ValidUser&quot

)
'end if
'==============================================

'UPDATE tblClaimsChart SET tblClaimsChart.NumClaims = 444, tblClaimsChart.ClaimAmount = 4444
'WHERE (((tblClaimsChart.CoverageID)=1));

'SELECT tblClaimsChart.CoverageID, tblClaimsChart.CoverageDescrip, tblClaimsChart.NumClaims, tblClaimsChart.ClaimAmount
'FROM tblClaimsChart
'WHERE (((tblClaimsChart.CoverageID)=1));

dim cnPoolPact
dim rsChartInfo
dim strQuery
dim intCount
'dim strPropertyQuery
'dim strALQuery
'dim strALDamageQuery
'dim strCrimeQuery
'dim strE&OQuery
'dim strGLQuery
'dim strLawQuery

intCount=1

Set cnPoolPact= server.CreateObject ("ADODB.Connection&quot

cnPoolPact.Open Application("PoolPactDatabaseConnect&quot

strQuery="SELECT tblClaimsChart.CoverageID, tblClaimsChart.CoverageDescrip, tblClaimsChart.NumClaims, tblClaimsChart.ClaimAmount FROM tblClaimsChart ORDER BY tblClaimsChart.CoverageID"' WHERE tblClaimsChart.CoverageID=1"

Set rsChartInfo = Server.CreateObject ("ADODB.Recordset&quot

rsChartInf

pen strQuery, cnPoolPact
%>
<div class="indent">
<table border="0" width="95%">
<tr>
<td valign="top">
<table border="0" cellpadding="0" cellspacing="0" align="center" width="95%">
<tr valign="top">
<td><img src="../Images/logopool_sm.gif" width=80 height=80 alt="" border="0">
</td>
<td align="center"><font size="4" face="Arial"><b>Nevada Public Agency
Insurance Pool<br>
&<br>
Public Agency Compensation Trust</b></font> </td>
<td><img src="../Images/logopact_sm.gif" width=70 height=87 alt="" border="0">
</td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" align="center" width="95%">
<tr>
<td>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="75%" border="1" align="center" height="54" bordercolor="#663333">
<tr>
<td height="2">
<p align="center"><b><font size="4">Claims Chart Administration<br>
</font></b></p>
<div align="center"></div>
<div align="center">
<table width="584" border="0">
<tr>
<td width="60" bgcolor="#CCCCFF">
<div align="center"><a href="../Database/PoolPact.mdb"><font size="2"><b>Download
DB </b></font></a> </div></td><td width="45" bgcolor="#FFCCFF">
<div align="center"><a href="LinksAdmin.asp"><font size="2"><b>Links
Admin</b></font></a></div></td><td width="59" bgcolor="#CCCCFF">
<div align="center"><a href="MembersAdmin.asp"><font size="2"><b>Members
Admin</b></font></a></div></td><td width="45" bgcolor="#FFCCFF">
<div align="center"><a href="EventsAdmin.asp"><font size="2"><b>Events
Admin</b></font></a></div></td><td width="50" bgcolor="#CCCCFF">
<div align="center"><a href="UsersAdmin.asp"><font size="2"><b>Users
Admin</b></font></a></div></td><td width="48" bgcolor="#FFCCFF">
<div align="center"><a href="VideosAdmin.asp"><font size="2"><b>Videos
Admin</b></font></a></div></td><td width="78" bgcolor="#CCCCFF">
<div align="center"><a href="WorkshopsAdmin.asp"><font size="2"><b>Workshops
Admin</b></font></a></div></td><td width="80" bgcolor="#FFCCFF">
<div align="center"><font size="2"><a href="ClaimsChartAdmin.asp"><b>Claims
Chart Admin</b></a></font></div></td><td width="38" bgcolor="#CCCCFF">
<div align="center"><a href="AdminMain.asp"><font size="2"><b>Admin
Home</b></font></a></div></td></tr>
</table>
<%
with Response

'Begin writing the static part of the table:
.Write "<form method='post' action='ClaimsChartProc.asp' name=frmChart onSubmit='return formValidation()'>"
.Write "<table width='600' border='1'>"
.Write "<tr bgcolor='#663333'>"
.Write "<td width='259'><b><font color='#FFFFFF'>Coverage Description</font></b></td>"
.Write "<td width='234'><b><font color='#FFFFFF'># of Claims</font></b></td>"
.Write "<td width='85'><b><font color='#FFFFFF'>Amount</font></b></td>"
.Write "</tr>"

'Begin writing the dynamic part of the table:

Do while rsChartInfo("CoverageID&quot

<8
.Write "<tr bgcolor='#FFCCCC'>"
.Write "<td width='259'>" & rsChartInfo("CoverageDescrip&quot

& "</td>"
.Write "<td width='234' align='center'>"
.Write "<input type='text' name='txtNumClaims" & intCount & "' size='6' value=" & rsChartInfo("NumClaims&quot

& ">"
.Write "</td>"
.Write "<td width='85'>"
.Write "<input type='text' name='txtClaimAmt$" & intCount & "' size='10' value='" & rsChartInfo("ClaimAmount&quot

& "'>"
.Write "</td>"
.Write "</tr>"

rsChartInfo.MoveNext

intCount=intCount+1
Loop

'Write the Total Claims Experience Line in Blue

.Write "<tr bgcolor='#CCCCFF'>"
.Write "<td colspan='2'>"
.Write "<div align='center'><b>Total Claims Experience</b></div>"
.Write "</td>"
.Write "<td width='85'>"
.Write "<div align='center'>(auto calc)</div>"
.Write "</td>"
.Write "</tr>"

'Write the second half of the Chart, below the Total Claims Experience Line in Blue
dim intCoverageID

for intCoverageID=8 to 11
Do while rsChartInfo("CoverageID&quot

=intCoverageID
.Write "<tr bgcolor='#FFCCCC'>"
.Write "<td width='259'>" & rsChartInfo("CoverageDescrip&quot

& "</td>"
.Write "<td width='234'> </td>"
.Write "<td width='85'>"
.Write "<input type='text' name='txtClaimAmt$" & intCoverageID & "' size='10' value='" & rsChartInfo("ClaimAmount&quot

& "'>"
.Write "</td>"
.Write "</tr>"

rsChartInfo.MoveNext
Loop
next

'Write the total expected losses line in blue

.Write "<tr bgcolor='#CCCCFF'>"
.Write "<td colspan='2'>"
.Write "<div align='center'><b>Total Expected Pool Losses</b></div>"
.Write "</td>"
.Write "<td width='85'>"
.Write "<div align='center'>(auto calc)</div>"
.Write "</td>"
.Write "</tr>"

'Write Pro Rated Loss Fund Contrib Line

If rsChartInfo("CoverageID&quot

=12 then
.Write "<tr bgcolor='#FFCCCC'>"
.Write "<td width='259'>Pro Rated Loss Fund Contributions</td>"
.Write "<td width='234'> </td>"
.Write "<td width='85'>"
.Write "<input type='text' name='txtClaimAmt$" & rsChartInfo("CoverageID&quot

& "' size='10' value='" & rsChartInfo("ClaimAmount&quot

& "'>"
.Write "</td>"
.Write "</tr>"
end if

'Write the Last line of the table - Annual Loss Fund Ratio:

.Write "<tr bgcolor='#CCCCFF'>"
.Write "<td colspan='2'>"
.Write "<div align='center'><b>Annual Loss Fund Ratio</b></div>"
.Write "</td>"
.Write "<td width='85'>"
.Write "<div align='center'>(auto calc)</div>"
.Write "</td>"
.Write "</tr>"

'Begin writing the static table closing tags

.Write "</table>"
.Write "<p>"

'Write the Buttons:

.Write "<input type='submit' name='Submit' value='Submit'> "
.Write "<input type='reset' name='Reset' value='Clear Entire Chart'>"
.Write "</p>"

'Finish writing the static table closing tags

.Write "</form>"
.Write "<p> </p>"
.Write "</div>"
.Write "<p align='center'> </p>"
.Write "</td>"
.Write "</tr>"
.Write "</table>"

end with
%>
</div>
</td>
</tr>
</table>
<p align="left"> </p>
<p align="center"> </p>
<h3 align="center"> </h3>
<h3 align="center"> </h3>
<h3 align="center"> </h3>
<h3 align="center"> </h3>
</div>
</body>
</html> Seek not outside yourself; heaven is within.

Discord · Aug 13, 2002

ok. i changed
if (isNaN(claimsBox.value))) to
if (isNaN(Number(claimsBox.value)))
and added the closing } for the function formValidation and it displays the please enter a number alert

scroce · Aug 13, 2002

SUCCESS!!!!!! thank you SO MUCH discord and trollacious. I really appreciate your keen observation and analysis.

Here is the final bit of code that works correctly for this page.

<script Language="JavaScript">

//this function tests for an empty and then makes sure whatever is entered is a number.
function isItNumber(elm) {
if (elm.value =="&quot

{
return false;
}

for (var i=0; i < elm.value.length; i++) {
if (elm.value.charAt(i) < "0" || elm.value.charAt(i) > "9&quot

{
return false;
}
}
}

//This is the main portion of the function - it incorporates all of the other functions
//outlined above and uses them on the text/combo boxes on the form before it is submitted.

function formValidation() {

var currentForm
var claimsBox
var amtBox

currentForm=document.frmChart

//This for validates the txtNumClaims boxes on the chart.
for (var claimsBoxCount = 1; claimsBoxCount < 8; claimsBoxCount++)
{

claimsBox = currentForm.elements['txtNumClaims' + claimsBoxCount];

if (isItNumber(claimsBox) == false) {
alert("Please check the # OF CLAIMS column for an incorrect entry. - Please only enter a number with no $ or . or ,&quot

;
claimsBox.focus();
return false;
}
}

//This for validates the txtClaimAmt$ boxes on the chart.
for (var amtBoxCount = 1; amtBoxCount < 13; amtBoxCount++)
{

amtBox = currentForm.elements['txtClaimAmt$' + amtBoxCount];

if (isItNumber(amtBox) == false) {
alert("Please check the AMOUNT column for an incorrect entry. - Please only enter a number with no $ or . or ,&quot

;
amtBox.focus();
return false;
}
}
}

</script> Seek not outside yourself; heaven is within.

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Looping in javascript: form validation

scroce

MIS

Discord

Programmer

scroce

MIS

Discord

Programmer

scroce

MIS

Discord

Programmer

scroce

MIS

Discord

Programmer

scroce

MIS

trollacious

Programmer

scroce

MIS

Discord

Programmer

scroce

MIS

Discord

Programmer

scroce

MIS

Similar threads

Part and Inventory Search

Sponsor