can u find the error? its urgent
can anyone find out the error in this code....
the rows are added dynamically,but while performing the validations ,all the columns are not being considered... only if the first column of any row is empty , it is displaying an alert window...
<html>
<head>
<script>
function addRowToTable()
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);
// first cell
var cellFirst = row.insertCell(0);
var first= document.createElement('input');
first.type = 'text';
first.name = 'txtRow' + iteration;
first.id = 'txtRow' + iteration;
first.size = 40;
first.onkeypress = keyPressTest;
cellFirst.appendChild(first);
// second cell
var cellSecond = row.insertCell(1);
var second = document.createElement('input');
second.type = 'text';
second.name = 'txtRow' + iteration;
second.id = 'txtRow' + iteration;
second.size = 40;
second.onkeypress = keyPressTest;
cellSecond.appendChild(second);
//third cell
var cellThird = row.insertCell(2);
var third = document.createElement('input');
third.type = 'text';
third.name = 'txtRow' + iteration;
third.id = 'txtRow' + iteration;
third.size = 40;
third.onkeypress = keyPressTest;
cellThird.appendChild(third);
//fourth cell
var cellFourth = row.insertCell(3);
var fourth = document.createElement('input');
fourth.type = 'text';
fourth.name = 'txtRow' + iteration;
fourth.id = 'txtRow' + iteration;
fourth.size = 40;
fourth.onkeypress = keyPressTest;
cellFourth.appendChild(fourth);
//fifth cell
var cellFifth = row.insertCell(4);
var fifth = document.createElement('input');
fifth.type = 'text';
fifth.name = 'txtRow' + iteration;
fifth.id = 'txtRow' + iteration;
fifth.size = 40;
fourth.onkeypress = keyPressTest;
cellFifth.appendChild(fifth);
//sixth cell
var cellSixth = row.insertCell(5);
var sixth = document.createElement('input');
sixth.type = 'text';
sixth.name = 'txtRow' + iteration;
sixth.id = 'txtRow' + iteration;
sixth.size = 40;
sixth.onkeypress = keyPressTest;
cellSixth.appendChild(sixth);
//seventh cell
var cellSeventh = row.insertCell(6);
var seventh = document.createElement('input');
seventh .type = 'text';
seventh .name = 'txtRow' + iteration;
seventh .id = 'txtRow' + iteration;
seventh .size = 40;
seventh .onkeypress = keyPressTest;
cellSeventh .appendChild(seventh );
//eighth cell
var cellEighth = row.insertCell(7);
var eighth = document.createElement('input');
eighth .type = 'text';
eighth .name = 'txtRow' + iteration;
eighth .id = 'txtRow' + iteration;
eighth .size = 40;
eighth .onkeypress = keyPressTest;
cellEighth .appendChild(eighth );
}
function keyPressTest(e, obj)
{
var validateChkb = document.getElementById('chkValidateOnKeyPress');
if (validateChkb.checked)
{
var displayObj = document.getElementById('spanOutput');
var key;
if(window.event)
{
key = window.event.keyCode;
}
else if(e.which)
{
key = e.which;
}
var objId;
if (obj != null)
{
objId = obj.id;
}
else
{
objId = this.id;
}
displayObj.innerHTML = objId + ' : ' + String.fromCharCode(key);
}
}
function removeRowFromTable()
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}
function openInNewWindow(frm)
{
// open a blank window
var aWindow = window.open('', 'TableAddRowNewWindow',
'scrollbars=yes,menubar=yes,resizable=yes,toolbar=no,width=400,height=400');
// set the target to the blank window
frm.target = 'TableAddRowNewWindow';
// submit
frm.submit();
}
function validateRow(frm)
{
var chkb = document.getElementById('chkValidate');
if (chkb.checked)
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length - 1;
var i;
for (i=1; i<=lastRow; i++)
{
var aRow = document.getElementById('txtRow' + i);
if (aRow.value.length <= 0)
{
alert('Row ' + i + ' is empty');
return;
}
}
}
openInNewWindow(frm);
}
</script>
</head>
<body>
<form action="tableaddrow_nw.html" method="get">
<p>
<input type="checkbox" id="chkValidateOnKeyPress" checked="checked" />
Display OnKeyPress
<span id="spanOutput" style="border: 1px solid #000; padding: 3px;">
</span>
</p>
<table border="1" id="tblSample">
<tr>
<th> Date </th>
<th> name </th>
<th> fathers name </th>
<th> mothers name</th>
<th> phone no </th>
<th> city</th>
<th>country</th>
<th>pin code</th>
<tr>
<td>
<input type="text" name="txtRow1" id="txtRow1" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td><input type="text" name="txtRow2" id="txtRow2" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow3" id="txtRow3" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow4" id="txtRow4" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow5" id="txtRow5" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow6" id="txtRow6" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow7" id="txtRow7" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow8" id="txtRow8" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
</tr>
</table>
<p>
<input type="button" value="Add" onclick="addRowToTable();" />
<input type="button" value="Remove" onclick="removeRowFromTable();" />
<input type="button" value="Submit" onclick="validateRow(this.form);"
/>
<input type="checkbox" id="chkValidate" /> Validate Submit
</p>
</form>
</body>
</html>
the rows are added dynamically,but while performing the validations ,all the columns are not being considered... only if the first column of any row is empty , it is displaying an alert window...
<html>
<head>
<script>
function addRowToTable()
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);
// first cell
var cellFirst = row.insertCell(0);
var first= document.createElement('input');
first.type = 'text';
first.name = 'txtRow' + iteration;
first.id = 'txtRow' + iteration;
first.size = 40;
first.onkeypress = keyPressTest;
cellFirst.appendChild(first);
// second cell
var cellSecond = row.insertCell(1);
var second = document.createElement('input');
second.type = 'text';
second.name = 'txtRow' + iteration;
second.id = 'txtRow' + iteration;
second.size = 40;
second.onkeypress = keyPressTest;
cellSecond.appendChild(second);
//third cell
var cellThird = row.insertCell(2);
var third = document.createElement('input');
third.type = 'text';
third.name = 'txtRow' + iteration;
third.id = 'txtRow' + iteration;
third.size = 40;
third.onkeypress = keyPressTest;
cellThird.appendChild(third);
//fourth cell
var cellFourth = row.insertCell(3);
var fourth = document.createElement('input');
fourth.type = 'text';
fourth.name = 'txtRow' + iteration;
fourth.id = 'txtRow' + iteration;
fourth.size = 40;
fourth.onkeypress = keyPressTest;
cellFourth.appendChild(fourth);
//fifth cell
var cellFifth = row.insertCell(4);
var fifth = document.createElement('input');
fifth.type = 'text';
fifth.name = 'txtRow' + iteration;
fifth.id = 'txtRow' + iteration;
fifth.size = 40;
fourth.onkeypress = keyPressTest;
cellFifth.appendChild(fifth);
//sixth cell
var cellSixth = row.insertCell(5);
var sixth = document.createElement('input');
sixth.type = 'text';
sixth.name = 'txtRow' + iteration;
sixth.id = 'txtRow' + iteration;
sixth.size = 40;
sixth.onkeypress = keyPressTest;
cellSixth.appendChild(sixth);
//seventh cell
var cellSeventh = row.insertCell(6);
var seventh = document.createElement('input');
seventh .type = 'text';
seventh .name = 'txtRow' + iteration;
seventh .id = 'txtRow' + iteration;
seventh .size = 40;
seventh .onkeypress = keyPressTest;
cellSeventh .appendChild(seventh );
//eighth cell
var cellEighth = row.insertCell(7);
var eighth = document.createElement('input');
eighth .type = 'text';
eighth .name = 'txtRow' + iteration;
eighth .id = 'txtRow' + iteration;
eighth .size = 40;
eighth .onkeypress = keyPressTest;
cellEighth .appendChild(eighth );
}
function keyPressTest(e, obj)
{
var validateChkb = document.getElementById('chkValidateOnKeyPress');
if (validateChkb.checked)
{
var displayObj = document.getElementById('spanOutput');
var key;
if(window.event)
{
key = window.event.keyCode;
}
else if(e.which)
{
key = e.which;
}
var objId;
if (obj != null)
{
objId = obj.id;
}
else
{
objId = this.id;
}
displayObj.innerHTML = objId + ' : ' + String.fromCharCode(key);
}
}
function removeRowFromTable()
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}
function openInNewWindow(frm)
{
// open a blank window
var aWindow = window.open('', 'TableAddRowNewWindow',
'scrollbars=yes,menubar=yes,resizable=yes,toolbar=no,width=400,height=400');
// set the target to the blank window
frm.target = 'TableAddRowNewWindow';
// submit
frm.submit();
}
function validateRow(frm)
{
var chkb = document.getElementById('chkValidate');
if (chkb.checked)
{
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length - 1;
var i;
for (i=1; i<=lastRow; i++)
{
var aRow = document.getElementById('txtRow' + i);
if (aRow.value.length <= 0)
{
alert('Row ' + i + ' is empty');
return;
}
}
}
openInNewWindow(frm);
}
</script>
</head>
<body>
<form action="tableaddrow_nw.html" method="get">
<p>
<input type="checkbox" id="chkValidateOnKeyPress" checked="checked" />
Display OnKeyPress
<span id="spanOutput" style="border: 1px solid #000; padding: 3px;">
</span>
</p>
<table border="1" id="tblSample">
<tr>
<th> Date </th>
<th> name </th>
<th> fathers name </th>
<th> mothers name</th>
<th> phone no </th>
<th> city</th>
<th>country</th>
<th>pin code</th>
<tr>
<td>
<input type="text" name="txtRow1" id="txtRow1" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td><input type="text" name="txtRow2" id="txtRow2" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow3" id="txtRow3" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow4" id="txtRow4" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow5" id="txtRow5" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow6" id="txtRow6" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow7" id="txtRow7" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
<td>
<input type="text" name="txtRow8" id="txtRow8" size="40"
onkeypress="keyPressTest(event, this);" />
</td>
</tr>
</table>
<p>
<input type="button" value="Add" onclick="addRowToTable();" />
<input type="button" value="Remove" onclick="removeRowFromTable();" />
<input type="button" value="Submit" onclick="validateRow(this.form);"
/>
<input type="checkbox" id="chkValidate" /> Validate Submit
</p>
</form>
</body>
</html>
Vasudha
January 8,