...

View Full Version : Add/Remove Row buttons not working properly.



Boskie
12-14-2011, 08: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>

Logic Ali
12-14-2011, 04:30 PM
So you have two global functions called addRow and two global functions called deleteRow. I wonder how that could cause a problem?

Boskie
12-15-2011, 04:41 AM
Ok, matching global functions changed from {addRow} and {deleteRow} Thank you for pointing that out.
I now have {addRow},{addRow1},{deleteRow}, and {deleteRow1}.
This has fixed all of the addRow issues, but i'm still getting the object error with the {deleteRow}.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum