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]);
...
Source:stackexchange.com