Поиск данных после загрузки данных
Я использую DataTables 1.10 в проекте Rails 4.2. У меня есть следующее в файле активов JS:
var table = $('#ticket_details').DataTable({
stateSave: true,
deferRender: true,
ajax: $('#ticket_details').data('source'),
"columns": [
{ "data": "reference_number" },
{ "data": "location" },
{ "data": "title" },
{ "data": "ticket_category", className: "hidden-xs" },
{ "data": "opened_date" },
{ "data": "last_update", className: "hidden-sm hidden-xs" },
{ "data": "time", className: "hidden-xs", "orderData": 7 },
{ "data": "decimal_time", "searchable": false, className: "hidden-lg hidden-md hidden-sm hidden-xs hidden"},
{ "data": "open_or_closed", className: "hidden-lg hidden-md hidden-sm hidden-xs hidden"},
{ "data": "assigned_to", className: "hidden-md hidden-sm hidden-xs" },
{ "data": "icons", className: "hidden-sm hidden-xs" }]} );
setInterval( function () {
table.ajax.reload( null, false ); }, 60000 );
Я хотел бы найти таблицу в моей скрытой колонке, в которой указано, является ли заявка открытой или закрытой. У меня есть две кнопки с несколькими JS за ними, чтобы переключаться между открытым и закрытым, но я бы хотел, чтобы по умолчанию открывать заявки
$('#ticket_details').dataTable( {
"initComplete": function(settings, json) {
table.columns(8).search("Open").draw();
}
} );
$('#open_toggle').on('click', function () {
table.columns(8).search("Open").draw();
});
$('#closed_toggle').on('click', function () {
table.columns(8).search("Closed").draw();
});
Однако при загрузке страницы таблица отображает все. Конечно, если бы я использовал drawCallback(), а затем перерисовал таблицу, это бы просто создало бесконечный цикл?
1 ответ
Решение
Вы можете сделать начальный поиск с search
опция ссылка
Некоторым нравится:
var table = $('#ticket_details').DataTable({
"search": {
"search": "Fred"
},
stateSave: true,
deferRender: true,
ajax: $('#ticket_details').data('source'),
"columns": [
{ "data": "reference_number" },
{ "data": "location" },
{ "data": "title" },
{ "data": "ticket_category", className: "hidden-xs" },
{ "data": "opened_date" },
{ "data": "last_update", className: "hidden-sm hidden-xs" },
{ "data": "time", className: "hidden-xs", "orderData": 7 },
{ "data": "decimal_time", "searchable": false, className: "hidden-lg hidden-md hidden-sm hidden-xs hidden"},
{ "data": "open_or_closed", className: "hidden-lg hidden-md hidden-sm hidden-xs hidden"},
{ "data": "assigned_to", className: "hidden-md hidden-sm hidden-xs" },
{ "data": "icons", className: "hidden-sm hidden-xs" }
]
});