[英]Dynamically add and remove rows in an HTML table
I have created a drop down table that should delete the existing rows upon selecting something from the drop down while adding new rows. 我创建了一个下拉表,在添加新行时从下拉列表中选择某些内容时应删除现有行。
I am able to add, but I can't figure out how to delete the old ones. 我可以添加,但是我不知道如何删除旧的。 Help!
救命!
var currencies;
$.ajax({
url: 'data.json',
type: "post",
dataType: "json",
method: "GET",
success: function (data, textStatus, jqXHR) {
currencies = data[0].currencies;
drawTable(currencies);
}
});
function drawTable(currencies) {
for (var i = 0; i < currencies.length; i++) {
drawRow(currencies[i]);
}
}
function IfTheyPicked5Days() {
if ($("#dropdown")[0].value=="fivedays") {
return true;
}
else {
return false;
}
}
function redrawTableForPeopleWhoPicked1Month() {
drawTable(currencies);
}
function drawRow(rowData) {
var row = $("<tr />")
$("#currencyhomework").append(row);
row.append($("<td>" + rowData.currency + "</td>"));
row.append($("<td>" + rowData.country + "</td>"));
row.append($("<td>" + rowData.ranges.oneday + "</td>"));
if (IfTheyPicked5Days()){
row.append($("<td>" + rowData.ranges.fivedays + "</td>"));
} else {
row.append($("<td>" + rowData.ranges.onemonth + "</td>"));
}
} }
function drawTable(currencies) {
//empty the table here:
$("#currencyhomework").empty();
for (var i = 0; i < currencies.length; i++) {
drawRow(currencies[i]);
}
}
Every time when drawTable is called you should empty it. 每次调用drawTable时,都应该将其清空。 This way every (re)draw of the table starts with updated data.
这样,表的每个(重新)绘制都从更新的数据开始。
Empty()
is jQuery's equivalent of element.innerHTML = null
. Empty()
是jQuery的 element.innerHTML = null
的等效项。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.