How to traverse a table using DOM & javascript to get input values to put in php variables?

Row 1 HTML
------------
<table id="distline" width="675"  cellpadding="3" cellspacing="0" >
    <tr class="blck12">
      <td bgcolor="7C7C7C"></td>
      <td size="3" align="center" class="lbl">1</td>
      <td><input  name="bu1"   type="text" size="5"   maxlength = "5"  value="" tabindex="100"/></td>
      <td><input  name="dept1" type="text" size="5"   maxlength = "5"  value="" tabindex="101"/></td>
      <td><input  name="acct1" type="text" size="9"   maxlength = "9"  value="" tabindex="102"/></td>
      <td><input  name="proj1" type="text" size="5"   maxlength = "5"  value="" tabindex="103"/></td>
      <td><input  name="task1" type="text" size="5"   maxlength = "5"  value="" tabindex="104"/></td>
      <td><input  name="amt1"  type="text" size="14"  maxlength = "14" value="" tabindex="105"/></td>
      <td>
          <input type="image"  class="addrow" alt="add row" src="images/rowOutAdd.png" id="addrow"
            onmouseout= "this.src='images/rowOutAdd.png'"
            onmouseover="this.src='images/rowOverAdd.png'"
            onmousedown="this.src='images/rowDownAdd.png'"  onclick="addRowToTable(); return false"/>&nbsp;
          <input type="image"  class="delrow" alt="del row" src="images/rowOutDel.png" id="delrow"
            onmouseout= "this.src='images/rowOutDel.png';"
            onmouseover="this.src='images/rowOverDel.png'"
            onmousedown="this.src='images/rowDownDel.png'"  onclick="removeRowFromTable(); return false"/>
            <input  name="dlrow" id="dlrow"  type="hidden" size="1"   maxlength = "1"  value="" /></td>
      <td bgcolor="7C7C7C"></td>
    </tr>
</table>
 
Javascript to add rows 2...n.
-----------------------------------
function addRowToTable()
{
  var tbl = document.getElementById('distline');
  var lastRow = tbl.rows.length;
  var i = lastRow + 1;
  var row = tbl.insertRow(lastRow);
  row.className="blck11";
 
  // cell 0  css
  var cell0  = row.insertCell(0);
  cell0.style.backgroundColor = "#7C7C7C";
  cell0.style.topMargin = "3px";
 
  // cell 1 line no
  var cell1 = row.insertCell(1);
  cell1.style.textAlign = "center";
  cell1.style.fontFamily =  "Arial, Helvetica, sans-serif";
  cell1.style.fontSize = "12px";
  cell1.style.fontStyle = "normal";
  cell1.style.fontWeight  = "bolder";
  cell1.appendChild(document.createTextNode(i) );
 
  // cell 2 bu
  var cell2 = row.insertCell(2);
  var el = document.createElement('input');
  el.type = "text";
  el.id = 'bu' + (i);
  el.size = 5;
  el.maxLenght = 5;
  el.value = "";
  cell2.appendChild(el);
 
  // cell 3 dept
  var cell3 = row.insertCell(3);
  var el = document.createElement('input');
  el.type = "text";
  el.id = 'dept' + (i);
  el.size = 5;
  el.maxLenght = 5;
  el.value =  "";
  cell3.appendChild(el);
 
  // cell 4 account
  var cell4 = row.insertCell(4);
  var el = document.createElement('input');
  el.type = "text";
  el.id = 'acct' + (i);
  el.size = 9;
  el.maxLenght = 9;
  el.value =  "";
  cell4.appendChild(el);
 
  // cell 5 project
  var cell5 = row.insertCell(5);
  var el = document.createElement('input');
  el.type = "text";
  el.id = 'proj' + (i);
  el.size = 5;
  el.maxLenght = 5;
  el.value =  "";
  cell5.appendChild(el);
 
  // cell 6 task
  var cell6 = row.insertCell(6);
  var el = document.createElement('input');
  el.type = "text";
  el.id = 'task' + (i);
  el.size = 5;
  el.maxLenght = 5;
  el.value =  "";
  cell6.appendChild(el);
 
  // cell 7 amount
  var cell7 = row.insertCell(7);
  var el = document.createElement('input');
  el.type = "text";
  el.id = 'amt' + (i);
  el.size = 14;
  el.maxLenght = 14;
  el.value =  "";
  cell7.style.fontFamily = "Arial, Helvetica, sans-serif";
  cell7.style.fontSize  = "12px";
  cell7.style.fontStyle = "normal";
  cell7.style.fontWeight = "500";
  cell7.style.color = "#000000";
  cell7.style.textDecoration = "none";
  cell7.appendChild(el);
 
  // cell 8 empty
  var cell8 = row.insertCell(8);
 
  // cell 9 css
  var cell9 = row.insertCell(9);
  cell9.style.backgroundColor = "#7C7C7C";
  cell9.style.topMargin = "3px"
}

                                  

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124: