Boskie
12-14-2011, 07:46 AM
I have 2 tables with Add/Remove Row buttons. The first table's Add Row button adds a row that belongs in the second table, and the Remove Row button gives me an Object Error. The second table works properly. The JavaScript for both tables is identical except for the ID's. When the tables are put into seperate html files both of the Add buttons work properly, but the remove row button from table one is still giving me the Object Error. Can someone point out what i'm doing wrong? Thanks.
Code for the first table
<SCRIPT language="javascript">
function addRow(kodaktable) {
var table = document.getElementById(kodaktable);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell3.appendChild(element2);
var cell4 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell4.appendChild(element2);
var cell5 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell5.appendChild(element2);
var cell6 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell6.appendChild(element2);
}
</script>
<script>
function deleteRow(kodaktable) {
try {
var table = document.getElementById(kodaktable);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
<INPUT type="button" value="Add Row" onClick="addRow('kodaktable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('kodaktable')" />
<TABLE id="kodaktable" width="350px" border="1">
<TR>
<tr>
<th></th>
<th>Job Name</th>
<th>Job Number</th>
<th>Start Doc</th>
<th>End Doc</th>
<th>Total</th>
</tr>
<tr>
<td><INPUT type="checkbox" name="chk"/></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
</tr>
</TR>
</TABLE>
code for the second table.
<SCRIPT language="javascript">
function addRow(incidenttable) {
var table = document.getElementById(incidenttable);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
element2.size = "70";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
element2.size = "20";
cell3.appendChild(element2);
var cell4 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
element2.size = "20";
cell4.appendChild(element2);
}
function deleteRow(incidenttable) {
try {
var table = document.getElementById(incidenttable);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
<INPUT type="button" value="Add Row" onClick="addRow('incidenttable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('incidenttable')" />
<table id="incidenttable" width="790px" border="1">
<tr>
<th></th>
<th>Incident</th>
<th>Kodak Downtime</th>
<th>System Downtime</th>
</tr>
<tr>
<td><INPUT type="checkbox" name="chk"/></td>
<td><input type="text" name="name" size="70" /></td>
<td><input type="text" name="name" size="20"></td>
<td><input type="text" name="name" size="20"></td>
</tr>
</table>
Code for the first table
<SCRIPT language="javascript">
function addRow(kodaktable) {
var table = document.getElementById(kodaktable);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell3.appendChild(element2);
var cell4 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell4.appendChild(element2);
var cell5 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell5.appendChild(element2);
var cell6 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell6.appendChild(element2);
}
</script>
<script>
function deleteRow(kodaktable) {
try {
var table = document.getElementById(kodaktable);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
<INPUT type="button" value="Add Row" onClick="addRow('kodaktable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('kodaktable')" />
<TABLE id="kodaktable" width="350px" border="1">
<TR>
<tr>
<th></th>
<th>Job Name</th>
<th>Job Number</th>
<th>Start Doc</th>
<th>End Doc</th>
<th>Total</th>
</tr>
<tr>
<td><INPUT type="checkbox" name="chk"/></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
<td><input type="text" name="name" /></td>
</tr>
</TR>
</TABLE>
code for the second table.
<SCRIPT language="javascript">
function addRow(incidenttable) {
var table = document.getElementById(incidenttable);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
element2.size = "70";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
element2.size = "20";
cell3.appendChild(element2);
var cell4 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
element2.size = "20";
cell4.appendChild(element2);
}
function deleteRow(incidenttable) {
try {
var table = document.getElementById(incidenttable);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
<INPUT type="button" value="Add Row" onClick="addRow('incidenttable')" />
<INPUT type="button" value="Delete Row" onClick="deleteRow('incidenttable')" />
<table id="incidenttable" width="790px" border="1">
<tr>
<th></th>
<th>Incident</th>
<th>Kodak Downtime</th>
<th>System Downtime</th>
</tr>
<tr>
<td><INPUT type="checkbox" name="chk"/></td>
<td><input type="text" name="name" size="70" /></td>
<td><input type="text" name="name" size="20"></td>
<td><input type="text" name="name" size="20"></td>
</tr>
</table>