Выберите раскрывающийся фильтр, отображающий более одной записи в таблицах данных.

Question

Я использую таблицу данных с выпадающим фильтром выбора.Работает отлично.Моя проблема в выпадающем списке выбора, я получаю одну и ту же запись, которая также корректна, потому что у меня есть такие записи в таблице.Поэтому я должен отображать только одну опцию.

Например, у меня есть таблица и записи похожи на

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);                        
    } 
} );

Этот код для изменения данных, которые вы поделились по ссылке выше.Надеюсь, это поможет вам.