Фильтрация столбцов данных не работает на стороне сервера - PullRequest
0 голосов
/ 22 октября 2019

Я уже выполнил обработку на стороне сервера в datatable. Теперь я хочу выполнить отдельную фильтрацию столбцов на стороне сервера.

Я пробовал.

 $('#example thead th').each(function () {
     var title = $(this).text();
     $(this).html(title+' <input type="text" class="col-search-input" placeholder="Search ' + title + '" />');
});
var table = $('#example').DataTable({
        dom: 'lfBrtip',
        "processing":true,
        "serverSide":true,
        "ajax":{
            "url":"{{route('homeajax')}}",
            "dataType": "json",
            "type": "POST",
        },
        "columns":[
            {"data":"name"},
            {"data":"Position"},
            {"data":"office"},
            {"data":"age"},
            {"data":"start_date"},
            {"data":"salary"},
        ],
        initComplete: function(){
            this.api().columns().every(function(){
                $('input', this.header()).on('keyup change', function () {
                    if (table.search() !== this.value) {
                        table.search(this.value,true).draw();
                    }
                });
            });
        },
        paginate: true,   
    });

Это работает только для одного столбца, но когда я пытаюсь искать из другого поля, это нене работает

Показывает все данные, когда я пытаюсь ввести данные из другого столбца,

Ответы [ 3 ]

0 голосов
/ 22 октября 2019

Я знаю, что это немного нарушает ваш дизайн, но можете ли вы позволить DataTables создавать входные данные для поиска? Таким образом, он может настроить прослушиватель событий для поиска только в этом столбце. Я использую вариант кода по этой ссылке:

http://live.datatables.net/tobekuxu/1/edit

Еще одна вещь, на которую стоит обратить внимание (возможно, попробуйте это сначала), я думаю, что вы просматриваете всю таблицу, когда хотитеискать только этот столбец. Попробуйте что-то подобное в вашей функции column (). Every ():

this.api().columns().every(function(){
    let column = this;
    $('input', this.header()).on('keyup change', function () {
        if (column.search() !== this.value) {
            column.search(this.value,true).draw();
        }
    });
});
0 голосов
/ 22 октября 2019

Может быть, этот код Ajax поможет вам. aoColumns , если вам нужно включить фильтр только name, Position и start_date (Custom filter)

 "aoColumns": [
        { "bSortable": true },
        { "bSortable": true },
        { "bSortable": false },
        { "bSortable": false },
        { "bSortable": true },
        { "bSortable": false }
    ]
0 голосов
/ 22 октября 2019

Это зависит от запроса на стороне сервера, который вы использовали для выборки данных. Если в ваш запрос включается, вам нужно передать имя столбца, как показано ниже:

"columns":[
        {"data":"name"},
        {"data":"tbl.Position"}, //tbl is join table alias.
        {"data":"office"},
        {"data":"age"},
        {"data":"start_date"},
        {"data":"salary"},
    ],
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...