Question

我正在使用带有选择下拉过滤器的数据表。运行良好。我的问题是在select下拉列表中，我得到的记录多于一条也要更正的记录，因为我在表中有类似的记录。所以我只需要显示一个选项。

例如，我有一张桌子，记录就像

id    | name  | game      | ground 
1     | lkjh  | Cricket   | ground1
2     | poiu  | Baseball  | ground2
3     | qwee  | Cricket   | ground3
4     | adsd  | badminton | ground4
5     | poiu  | badminton | ground5

所以我得到了类似的下拉列表。（这只是一个例子）

<select>
<option>Cricket</option>
<option>Baseball</option>
<option>Cricket</option>
<option>badminton</option>
<option>badminton</option>
</select>

我需要这样

<select>
<option>Cricket</option>
<option>Baseball</option>
<option>badminton</option>
</select>

您能在这个问题上帮助我吗？我正在使用以下脚本，参考链接为https://datatables.net/examples/api/multi_filter_select.html

$(document).ready(function() {
  $('#paymentList').DataTable({
    initComplete: function() {
      this.api().columns("2").every(function() {
        var column = this;
        var select = $('<select name="select_filter_action"><option value="">All</option></select>')
          .appendTo($("#select_filter_action").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) {
          //console.log(d);
          select.append('<option value="' + d + '">' + d + '</option>')
        });
      });
    }
  });
});

Answer 1

为过滤器创建选择选项时，仅需要选择唯一值。您可以检查以下代码：

var selectOptionsCollections = [];
column.data().unique().sort().each( function ( d, j ) {
    if (jQuery.inArray(d, selectOptionsCollections) === -1) {
        select.append( '<option value="'+d+'">'+d+'</option>' )
        selectOptionsCollections.push(d);                        
    } 
} );

此代码用于您在上述链接上共享的数据表更改。希望对您有帮助。

选择下拉过滤器，以在数据表中显示多个相同记录

1 个答案: