[Answer]-Add table cell using JQuery

1👍

Why not construct the table while processing the data?

<script type="text/javascript">
$(document).ready(function fill_table() {
$.ajax({
type:"GET",
url: "/Tplots/ajax_temp/",
dataType:'json',
success: function(response) {
    for(var i = 0; i< response.length; i++) 
    {
        $('#templates tbody').append("<tr>");            
        var item = response[i];
        for (var j = 0; j<4 ;j++) { 
            if (j <> 3) { // not the last column
                $('#templates tbody').append("<td>" + item[j] + "</td>");
            } else {
                $('#templates tbody').append("<td><select>");               
                for (var k = 0; k<as_of.length; k++) {
                    var asofdate = as_of[k];
                    $('#templates tbody').append("<option>"+asofdate+"</option>");
                } 
                $('#templates tbody').append("</td>"); 
            }
         }
         $('#templates tbody').append("</tr>");           
    }
})
})
</script>

0👍

You should take a look at the HTML your script generated. Looks like you are assigning the same ID to all rows and drop downlist. Either assign a unique ID so the jQuery selector can select a correct row or save jQuery object you create as follows:

var $table = $("#templates tbody");
...

var $row = $("<tr>").appendTo($table);
...
var $td = $("<td>").appendTo($row);
var $select = $("<select>").appendTo($td);
for(var k=0,size=as_of.length; k<size; k++) 
  $("<option>").appendTo($select).text(as_off[k]);
...

Leave a comment