willyamPax Posted August 22, 2008 Share Posted August 22, 2008 <script type="text/javascript"> var t=1; var intime=0; //showData(data){ //} function insRow(r) { intime=intime+1; var x=document.getElementById('myTable').insertRow(t); var date=x.insertCell(0); var h=x.insertCell(1); var d=x.insertCell(2); var r=x.insertCell(3); var del=x.insertCell(4); //date.innerHTML="<input type='text' size='10' name='date"+t+"'>"; var date1= document.createElement('input'); date1.name="date"+t; date1.value="date"+t; date1.size='10'; date.appendChild(date1); var hours= document.createElement('input'); hours.name='hours'+t; hours.value='hours'+t; h.appendChild(hours); var des= document.createElement('textarea'); des.name='descrition'+t; des.cols='20'; des.rows='5'; d.appendChild(des); //des.innerHTML="<textarea rows='5' name='descrition"+t+"' cols='20'></textarea>" var sel = document.createElement('select'); sel.name = 'remarks' + t; sel.options[0] = new Option('Done', 'Done'); sel.options[1] = new Option('ongoing', 'ongoing'); r.appendChild(sel); del.innerHTML="<input type='button' value='Delete' onclick='deleteRow(this)'>"; t++; document.time.time1.value=intime; } function deleteRow(r) { var i=r.parentNode.parentNode.rowIndex; document.getElementById('myTable').deleteRow(i); t=t-1; intime=intime-1; document.time.time1.value=intime; /* i comment this one coz i cant seem to update the content of every cell in a row for (c=1;c<=intime;c++){ var x=document.getElementById('myTable').rows; var y=x[c].cells; y[c].innerHTML="NEW CONTENT"; }*/ } </script> <form name ='time' > <table id="myTable" border="1"> <input type="text" size='1'name='time1'value=''> <tr><td>Date</td> <td>Hours</td> <td>Description</td> <td>Remarks</td> <td><input type="button" onclick="insRow(this)" value="Insert row"></td> </tr> </table> </form> please help me on this one.... how can i update each content name of each cells in a row if i delete one of them... Link to comment https://forums.phpfreaks.com/topic/120806-how-can-i-update-each-content-name-of-each-cells-in-a-row-if-i-delete-one-of-the/ Share on other sites More sharing options...
Psycho Posted August 22, 2008 Share Posted August 22, 2008 This might not be the most efficinet, but it works: <html> <head> <script type="text/javascript"> var t=1; var intime=0; //showData(data){ //} function insRow(r) { intime=intime+1; var x=document.getElementById('myTable').insertRow(t); var date=x.insertCell(0); var h=x.insertCell(1); var d=x.insertCell(2); var r=x.insertCell(3); var del=x.insertCell(4); //date.innerHTML="<input type='text' size='10' name='date"+t+"'>"; var date1= document.createElement('input'); date1.name="date"+t; date1.value="date"+t; date1.id="date"+t; date1.size='10'; date.appendChild(date1); var hours= document.createElement('input'); hours.name='hours'+t; hours.value='hours'+t; hours.id='hours'+t; h.appendChild(hours); var des= document.createElement('textarea'); des.name='descrition'+t; des.id='descrition'+t; des.cols='20'; des.rows='5'; d.appendChild(des); //des.innerHTML="<textarea rows='5' name='descrition"+t+"' cols='20'></textarea>" var sel = document.createElement('select'); sel.name = 'remarks' + t; sel.id = 'remarks' + t; sel.options[0] = new Option('Done', 'Done'); sel.options[1] = new Option('ongoing', 'ongoing'); r.appendChild(sel); del.innerHTML="<input type='button' value='Delete' onclick='deleteRow(this)'>"; t++; document.time.time1.value=intime; } function deleteRow(r) { var i=r.parentNode.parentNode.rowIndex; document.getElementById('myTable').deleteRow(i); t=t-1; while (document.getElementById('date'+(i+1))) { nextID = (i+1); dateObj = document.getElementById('date'+nextID); dateObj.name = 'date'+i; dateObj.value = 'date'+i; dateObj.id = 'date'+i; hoursObj = document.getElementById('hours'+nextID); hoursObj.name = 'hours'+i; hoursObj.value = 'hours'+i; hoursObj.id = 'hours'+i; descObj = document.getElementById('descrition'+nextID); descObj.name = 'descrition'+i; descObj.id = 'descrition'+i; remObj = document.getElementById('remarks'+nextID); remObj.name = 'remarks'+i; remObj.id = 'remarks'+i; i++; } intime=intime-1; document.time.time1.value=intime; /* i comment this one coz i cant seem to update the content of every cell in a row for (c=1;c<=intime;c++){ var x=document.getElementById('myTable').rows; var y=x[c].cells; y[c].innerHTML="NEW CONTENT"; }*/ } </script> </head> <body> <form name ='time' > <table id="myTable" border="1"> <input type="text" size='1'name='time1'value=''> <tr><td>Date</td> <td>Hours</td> <td>Description</td> <td>Remarks</td> <td><input type="button" onclick="insRow(this)" value="Insert row"></td> </tr> </table> </form> </body></html> Link to comment https://forums.phpfreaks.com/topic/120806-how-can-i-update-each-content-name-of-each-cells-in-a-row-if-i-delete-one-of-the/#findComment-623430 Share on other sites More sharing options...
willyamPax Posted August 27, 2008 Author Share Posted August 27, 2008 wow that really works... thanks alot... Link to comment https://forums.phpfreaks.com/topic/120806-how-can-i-update-each-content-name-of-each-cells-in-a-row-if-i-delete-one-of-the/#findComment-626703 Share on other sites More sharing options...
Psycho Posted August 27, 2008 Share Posted August 27, 2008 Be sure to mark the topic as solved. Link to comment https://forums.phpfreaks.com/topic/120806-how-can-i-update-each-content-name-of-each-cells-in-a-row-if-i-delete-one-of-the/#findComment-626841 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.