Как отфильтровать 3 столбца Datatable в одном раскрывающемся списке, не отображая дубликатыJquery

Программирование на jquery
Ответить
Anonymous
 Как отфильтровать 3 столбца Datatable в одном раскрывающемся списке, не отображая дубликаты

Сообщение Anonymous »

Мне нужно отфильтровать «Область 1», «Область 2» и «Область 3» (столбцы 2, 3 и 4) в раскрывающемся списке «Область» без отображения дубликатов. Вот моя таблица: https://www.berkshirecc.edu/_training/t ... tory-1.php.
Я попробовал удалить индекс столбца 2, а затем добавить еще один buildSelect, но выпадающие списки исчезают. Я думаю, моя ошибка в том, как я объединил эти два фрагмента кода. Любая помощь будет принята с благодарностью:
$(document).ready(function() {
var table = $('#bcc-directory').DataTable({
responsive: true,
searching: true
});

buildSelect(table);

table.on('draw', function() {
buildSelect(table);
});
$('#clear-table').on('click', function() {
table.search('').columns().search('').draw();
});
});

buildSelect(table);

table.on('draw',
function() {
buildSelect(table);
});
$('#clear-table').on('click',
function() {
table.search('').columns().search('').draw();
});

function buildSelect(table) {
var counter = 0;
table.columns([1, 7]).every(function() {
var column = table.column(this, {
search: 'applied'
});
counter++;
var select = $('').appendTo($('#dropdown' + counter).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('' + d.substr(0, 25) + '');
});

// The rebuild will clear the exisiting select, so it needs to be repopulated
var currSearch = column.search();
if (currSearch) {
// Use RegEx to find the selected value from the unique values of the column.
// This will use the Regular Expression returned from column.search to find the first matching item in column.data().unique
select.val(column.data().unique().toArray().find((e) = > e.match(new RegExp(currSearch))));
}
});
}

function buildAreaSelect(table) {

// Create select element
var select = $(' ').appendTo($('#dropdown' + counter).empty()).on('change',
function() {
var val = $.fn.dataTable.util.escapeRegex($(this).val());

// Search Area columns for selected Area
table.columns(2, 3, 4).search(val ? '^' + val + '$' : '', true, false).draw();
});

// Build single list of options from the Area columns
table.columns([2, 3, 4], {
search: 'applied'
}).data().flatten().unique().sort().each(function(d, j) {
select.append('' + d.substr(0, 25) + '');
});

// The rebuild will clear the existing select, so it needs to be repopulated
var currSearch = column.search();
if (currSearch) {
// Use RegEx to find the selected value from the unique values of the column.
// This will use the Regular Expression returned from column.search to find the first matching item in column.data().unique
select.val(table.columns([2, 3, 4], {
search: 'applied'
}).data().flatten().unique().toArray().find((e) = > e.match(new RegExp(currSearch))));
}
});
}


Подробнее здесь: https://stackoverflow.com/questions/785 ... ing-duplic
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Jquery»