Need Help with a For Loop

**Grizz** · May 7th, 2012, 07:57 AM

I'm trying to figure out how to use a for loop to loop through a table of textboxes. In which, the user enters data and then verifies that the data the user has entered is a number or is not empty. Thanks any help would be much appreciated.

Heres a sample of the code I have for the table:

<table border cellpadding="3" style= "float: left; width: 300px; clear: left; ">
<tr>
<td align="center"><input type="text" size="1" name="group1"/> </td>
<td align="center"><input type="text" size="1" name="group2"/> </td>
<td align="center"><input type="text" size="1" name="group3"/> </td>
<td align="center"><input type="text" size="1" name="group4"/> </td>
<td align="center"><input type="text" size="1" name="group5"/> </td>
<td align="center"><input type="text" size="1" name="group6"/> </td>
</tr>
<tr>
<td align="center"><input type="text" size="1" name="group1"/> </td>
<td align="center"><input type="text" size="1" name="group2"/> </td>
<td align="center"><input type="text" size="1" name="group3"/> </td>
<td align="center"><input type="text" size="1" name="group4"/> </td>
<td align="center"><input type="text" size="1" name="group5"/> </td>
<td align="center"><input type="text" size="1" name="group6"/> </td>
</tr>
<tr>
<td align="center"><input type="text" size="1" name="group1"/> </td>
<td align="center"><input type="text" size="1" name="group2"/> </td>
<td align="center"><input type="text" size="1" name="group3"/> </td>
<td align="center"><input type="text" size="1" name="group4"/> </td>
<td align="center"><input type="text" size="1" name="group5"/> </td>
<td align="center"><input type="text" size="1" name="group6"/> </td>
</tr>
</table>

**jasonwucinski** · May 7th, 2012, 11:24 AM

you can iterate over a table, in javascript, by doing something like this:

Code:

var table = document.getElementById("myTable");
for (var i = 0, cell; cell = table.cells[i]; i++) {
     //iterate through cells
getTB=cell[i].getElementsByTagName("input")
//gets the value of tb in cell

}

This iterates over the cells. you should give each control its own unique ID, then you can reference the individual controls in the cell. You will also need to give the table an ID (i used "myTable"). This should get you started. i havent tested this, but it should work with little work

**coothead** · May 9th, 2012, 04:14 AM

Hi there Grizz,

here is my possible solution to your problem...

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english"> 
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<title>check inputs for numbers</title>

<style type="text/css">
#table1 {
    float:left;
    clear:left;
    width:300px;
    border:1px outset #666;
    margin-bottom:10px;
 }
#table1 td {
    padding:3px;
    border:1px inset #666;
    text-align:center;
 }
#but {
    clear:both;
    display:block;
 }
.indicate{
    border-style:solid;
    border-color:#f00;
 }
</style>

<script type="text/javascript">

function init() {

document.getElementById('but').onclick=function() {

   nf=[];
   inps=document.getElementById('table1').getElementsByTagName('input');

for(c=0;c<inps.length;c++) {

   inps[c].className='';

if((inps[c].value=='')||(isNaN(inps[c].value))) {

   inps[c].className='indicate';   
   nf.push(c+1);

  }
 }

if(nf!='') {

   alert('input(s)...\n\n'+nf+'\n\n...require your attention');

   }
  }
 }
   window.addEventListener?
   window.addEventListener('load',init,false):
   window.attachEvent('onload',init);
</script>

</head>
<body>

<div>

<table id="table1"><tr>
<td><input type="text" size="1" name="group1"></td>
<td><input type="text" size="1" name="group2"></td>
<td><input type="text" size="1" name="group3"></td>
<td><input type="text" size="1" name="group4"></td>
<td><input type="text" size="1" name="group5"></td>
<td><input type="text" size="1" name="group6"></td>
</tr><tr>
<td><input type="text" size="1" name="group1"></td>
<td><input type="text" size="1" name="group2"></td>
<td><input type="text" size="1" name="group3"></td>
<td><input type="text" size="1" name="group4"></td>
<td><input type="text" size="1" name="group5"></td>
<td><input type="text" size="1" name="group6"></td>
</tr><tr>
<td><input type="text" size="1" name="group1"></td>
<td><input type="text" size="1" name="group2"></td>
<td><input type="text" size="1" name="group3"></td>
<td><input type="text" size="1" name="group4"></td>
<td><input type="text" size="1" name="group5"></td>
<td><input type="text" size="1" name="group6"></td>
</tr></table> 
<input id="but" type="button" value="check">
</div>

</body>
</html>

**Grizz** · May 11th, 2012, 05:30 PM

Thanks for the help you both really helped me out a lot. I think I now have it figured out. Thanks again!

**coothead** · May 12th, 2012, 04:01 AM

No problem, you're very welcome.

Thread: Need Help with a For Loop

Thread Tools

Display

Need Help with a For Loop

Re: Need Help with a For Loop

Re: Need Help with a For Loop

Re: Need Help with a For Loop

Re: Need Help with a For Loop

Posting Permissions