Select opts not deleting on row deletion
Select opts not deleting on row deletion
Cecsil
Posts: 4Questions: 1Answers: 0
Hi! How can I update the select options after having deleted a row? Currently I'm deleting the oldest row every x-second in DT as I'm adding a new row.
However the select options doesnt seem to update when I have deleted a row. How can I access the built in connection between the selects and rows in DT so I can refresh the options?
This discussion has been closed.
Answers
i.e. delete / remove the option from opt-list, when it no longer exists
//function that runs every time I pass new data to DT
function updateDatatable(data) {
$(".latest").removeClass("latest");
if ($.fn.DataTable.isDataTable(eventTable)) {
pushDataToEventTableArray(data);
table.row.add(dataSetForEventTable).draw(false);
sizeIcons();
var row;
var rowData;
table.rows().eq(0).each(function (index) {
row = table.row(index);
rowData = row.data();
if (rowData && rowData[0] === timeArray[0]) {
row.remove();
timeArray.splice(timeArray[0], 1);
timeArray = timeArray.filter(function () { return true; });
}
});
}
}
//in init DT function where I'm setting up the select options
...
initComplete: function() {
this.api().columns().every(function() {
var column = this;
var select =
$("<select style='width:100%; box-sizing:border-box;' class='form-control'><option value=''>All</option></select>")
.appendTo($(column.footer()).empty())
.on("change",
function() {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search(val ? "^" + val + "$" : "", true, false)
.draw();
});
column.data().unique().sort().each(function(d, j) {
select.append("<option value='" + d + "'>" + d + "</option>");
});
});
},