update each content name of each cell in a row

[willyamPax]

Code: Select all

<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 update each content name of each cell in a row....
coz ive search how but still i cant find answer...