Question

我在数据表中使用以下代码将下拉过滤器应用于表列。

initComplete: function () {
    this.api().columns().every( function () {   
    var column = this;
    var select = $('<select><option value=""></option></select>')
    .appendTo( $(column.header()).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>' )
   } ); 
} );

我试图仅显示1列的过滤器，这是一个隐藏的列，但是当我隐藏一列时，过滤器根本不起作用？

有没有办法做到这一点？

Answer 1

我可以使用以下方式从隐藏列中获取数据：

首先，我将隐藏类添加到表中的th标签：

user_embedding

下一步是将隐藏类设置为表对象中的所有列值：

<table id="example" class="display">
 <thead>
  <tr>
   <th>ID</th>
   <th>Name</th>
   <th class="hidden">Function</th>
   <th class="hidden">Category</th>
  </tr>
 </thead>
 <tfoot>
   <tr>
    <th class="id">ID</th>
    <th>Name</th>
    <th class="hidden">Function</th>
    <th class="hidden">Category</th>
  </tfoot>
</table>

<style>
 .hidden:{
  display: none;
 }
</style>

感谢以这种方式隐藏它们，因此我能够获取这些数据。例如，我用它然后用那些隐藏值过滤表。

const hidden = [2,3];
const table = $('#example').DataTable({
 "ajax": "/datatables/server_processing_expanded.php",
 "columnDefs": [
  {className: "hidden", "targets": hidden},
 ]
});

在您的情况下-我认为这将帮助您获取下拉列表中的值，因为我还将在数据表下方的面板中显示隐藏数据，如下所示：

table.column(3).search('1').draw();

我也从每个列中获取每个值的模态，并使用它进行过滤，但是我使用ajax从数据库中获取值。稍后，我将尝试编辑此答案以扩展它并向您展示我的工作方式-我认为这也可以为您提供帮助，但基本上，这只是扩展我的答案中的代码。

jQuery DataTable在隐藏列上显示过滤器

1 个答案: