带有下拉列表/选择的数据表仅在第一页、最后一页和最后一页呈现。可能是什么问题？

Question

我正在设置一个新的概述，并希望使用jQuery DataTables。 我在第一页上显示了正确的数据。但是当我按下下一页时，我的选择框没有任何选项。如果我调整窗口大小或任何强制重绘表的内容，则会更新表并显示正确的数据。 如果我选择显示最后一页，数据会立即正确显示，但中间的所有页面仍然没有在选择框中显示选项。 如何获得所有页面上显示的选项？

我尝试将数据表文档用于页面(https://datatables.net/reference/api/page%28%29)，但功能没有被击中。 另外，我已经尝试了其他几种方法来绘制下一页，但我无法让它工作。 目前，我正在制作表，然后再将其创建为数据表。

$.ajax({
...
success: function (response) {
CaseData = response;
console.log(CaseData)
//The following method creates the table
buildColumnHeader();
table = $('#case-layout-table').DataTable({
scrollY: "600px",
scrollX: true,
scrollCollapse: true,
responsive: true,
fixedColumns: {
leftColumns: 3
},
data: CaseData,
"language": {
"url": "http://cdn.datatables.net/plug-ins/1.10.19/i18n/Danish.json"
},
"columns": columns,
});
table = $('#case-layout-table').DataTable();
}
});

//this is code copied from datatables docs - neither are being hit on next/previous page
var table = $('#example').DataTable();
$('#next').on( 'click', function () {
table.page( 'next' ).draw( 'page' );
} );
$('#previous').on( 'click', function () {
table.page( 'previous' ).draw( 'page' );
} );

function generateDropDown(data, meta, control) {
var html = "";
if ($('#select-' + (data.ID + '1' + (meta.col - 1)) + '').has('option').length <= 0) {
html = '<select onChange="handleOnSelectChange(' + (data.ID + '1' + (meta.col - 1)) + ',' + data.ID + ')" style="width: 140px; text-align: center;" id=select-' + (data.ID + '1' + (meta.col - 1)) + '></select>';
for (var i in control.Parameters) {
var $option;
if (control.Parameters[i] === data.DataList[meta.col - 1].Case) {
$option = $('<option/>', {
value: control.Parameters[i],
text: control.Parameters[i],
selected: true,
});
}
else {
$option = $('<option/>', {
value: control.Parameters[i],
text: control.Parameters[i],
});
}
$('#select-' + (data.ID + '1' + (meta.col - 1)) + '').append($option);
}
}
return html;
}

在buildColumnHeader()-method中，我使用以下代码，它调用buildRender。

else {
columns[i] = {
title: group.ControlMetas[i - 1].Title,
type: group.ControlMetas[i - 1].Type,
orderDataType: "dom-" + group.ControlMetas[i - 1].Type,
data: null,
id: i,
render:
function (data, type, row, meta) {
return buildRender(data, meta)
}
}

并且构建渲染使用以下方法，如果我的控件类型是下拉列表

else if (control.Type === 'Dropdown') {
html = generateDropDown(data, meta, control)
```

Answer 1

我已经找到了解决问题的方法。 在generateDropDown方法中，我更改了 im 制作选择框的方式。所以我现在不是使用jQuery，而是在编写HTML。