如何从文本文件中预填充动态HTML表的值？

Question

i have the following code in jsfiddle, http://jsfiddle.net/y3x4q/

JavaScript:

         function buildTable(val)
      {
   var myTable =document.getElementById("contentTable");
 var j=val;
var r1=val;
var rows = [];
var cells = [];

while (myTable.hasChildNodes()) {
myTable.removeChild(myTable.lastChild);
}


for( var i = 0; i < 1; i++ )
{
rows[i] = myTable.insertRow(i);
if(i%3==2)rows[i].addClass("every3rdrow");
cells[i] = [];

for( var x = 0; x < j ; x++ )
{
    cells[i][x] =document.createElement((x==0)?"th":"td");
    cells[i][x].innerHTML = (x==0)?"<input id=t onchange=ty() name=t[] size=3>":"<input id=t1 onchange=ty1() name=t1[] size=3>";
    rows[rows.length - 1].appendChild(cells[i][x]);
}
 }

  }
  buildTable();  

HTML:

  <tr>
   <th>Number of Models:<title="Number of Models"></th>

   <td><select id="numbermodels" name="numbermodels" onmouseover="buildTable(this.value)" onchange="buildTable(this.value);buildTable4(this.value);">

    <option value="1">1</option >
   <option selected="selected" value="2">2</option >
      < option value="3">3</option >
    <option value="4">4</option >
   <option value="5">5</option >
    <option value="6">6</option >
    </select></td>
     </tr><br>

     <tr>
     <th>Number of heads per model:</th>
      <td>
    <table id="contentTable" border="1" name="contentTable">
    <!-- Fill table programmatically -->
   </table></td>
      </tr>

how i can fill the values of the table on-load from an external text file ? i have tried to use php tags inside javascript, but i couldn't get it that way, can this be achieved by using getElementsByTagName ? how to do this ?

Answer 1

Your best bet is using AJAX if you are attempting to get content from an external file on load. So use AJAX to get the data and probably JQuery to parse the data into your table. You won't be able to use a CSS file. I would almost guess using an HTML file would be easiest. Is there a reason you are using an external text file instead of an array?