jQuery DataTable显示条目下拉列表未显示默认值 - 在Firefox中

Question

我正在使用 Jquery DataTables 1.10.12 并面临问题

  

显示Jquery Datatable“显示条目”下拉列表的默认值   控制。

最初，该表为空，我将数据绑定到textboxes button click上的 //div holding the Jquery DataTable <div id="demo"> </div> //Javascript code <script type="text/javascript" src="@Url.Content("~/Scripts/jquery.dataTables.min.js")"></script> <script type="text/javascript"> var table; var arr = []; var dataSet = []; $(document).ready(function myfunction() { $('#demo').html('<table id="myTable" class="table table-striped table-bordered" cellspacing="0" width="100%" data-page-length="5"></table>'); table = $('#myTable').DataTable({ scrollY: "700px", scrollX: true, scrollCollapse: true, fixedColumns: false, paging: true, searching: true, ordering: true, info: true, lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]], pageLength: 10, sPaginationType: "full_numbers", //This function is associated with the fnDrawCallback property for DataTable for not displaying Table if no rows are present fnDrawCallback: function (settings) { // $("#myTable").parent().toggle(settings.fnRecordsDisplay() > 0); //$("select[name='myTable_length'] option[value='10']").attr('selected',true); }, columnDefs: [ { width: '10%', targets: 0 }, { "aTargets": 3, "mData": null, "mRender": function (data) { //Adding a button Dynamically to Delete the selected row from the table return "<button class='btn btn-danger' id='btnDelete'>Delete</button>"; } } ], data: dataSet, columns: [ { "title": "SerialNo" }, { "title": "EmployeeFirstName" }, { "title": "EmployeeLastName" }, { "title": "Remove" } ] }); $('#btnAdd').on("click", function () { var SerialNo; //Checks if javascript global array(arr) having value or not if (arr && arr.length > 0) { SerialNo = arr.length + 1; } else { SerialNo = 1; } var EmployeeFirstName = $('#EmployeeFirstName').val(); var EmployeeLastName = $('#EmployeeLastName').val(); var item = {}; item["SerialNo"] = SerialNo; item["EmployeeFirstName"] = EmployeeFirstName; item["EmployeeLastName"] = EmployeeLastName; arr.push(item); //Binding Data to the table table.row.add([item["SerialNo"], item["EmployeeFirstName"], item["EmployeeLastName"]]).draw(); // table.destroy(); }); var table = $('#myTable').DataTable(); $('#myTable tbody').on('click', 'button', function () { var rowdata = table.row($(this).parents('tr')).data(); //Getting the selected row "SerialNo" column value var serialNo = rowdata[0]; //Removing the selected row from the table table.row($(this).parents('tr')).remove().draw(); //Resetting the serial number to the "SerialNo" column table.rows().iterator('row', function (context, index) { //Getting each row of the datatable var idx = this.row(index); //Modifying the index value to be assigned to "SerialNo" column var tempSlNo = Number(index) + 1; //Redrawing the serial no value for the "SerialNo" column table.cell(idx, 0).data(tempSlNo).draw(); }); }); }); </script> 。我能够实现剩余的所有功能（向表中添加数据，排序，过滤......等）但不知道

  

为什么“显示条目”下拉控件的默认值不是   出现了？

以下是截图

加载页面

下拉菜单中没有可用的记录，但默认值未显示

将记录添加到数据表后 - 仍未显示默认值

以下是我到目前为止实施的代码

$subscribearray = "" . join(', ',$subscribearray) . "";  

请帮我实现此功能。谢谢。

Answer 1

从HTML中删除data-page-length="5"，如下图所示：

$('#demo').html('<table id="myTable" class="table table-striped table-bordered" cellspacing="0" width="100%"></table>');