jQuery + PHP Datatables Обработка на стороне сервера с фильтрацией столбцов - PullRequest
Новая
       2

jQuery + PHP Datatables Обработка на стороне сервера с фильтрацией столбцов

1 голос
/ 16 октября 2019

Я реализовал SSP с jQuery Datatables и глобальным фильтром, но после обзора я хотел реализовать фильтрацию по конкретным столбцам, но у меня возникли проблемы. Это код, который у меня есть на данный момент:

Javascript: 

$(document).ready(function() {
   initAdultTable();
});

function initAdultTable () {
  return tablessp = $('#members').DataTable({
    url: '<?php echo site_url("members"); ?>',
    processing: true,
    serverSide: true,
    paging: true,
    searching: true,
    pageLength: 25,
    lengthMenu: [[10, 25, 50, 100, 500, 1000,5000], [10, 25, 50, 100, 500, 1000, "All"]],
    deferRender: true,
    dom: 'flBrtip',
    retrieve: true,
    ordering: true,
    order: [[0, "desc"]],
    language: {
        "lengthMenu": "Display _MENU_ records per page",
        "zeroRecords": "Nothing found - sorry",
        "info": "Showing _MAX_ entries",
        "infoEmpty": "No records available",
        "infoFiltered": "( from _TOTAL_ total records)"
    },
    scrollx: true, 
    sScrollX: "100%",

    columns: [{data: "id"}, {data: "first_name"}, {data: "middle_name"},{data: "last_name"} , {data: "phone_number"} , {data: "company_location"} ,{data: "parent"} ,{data: "agency_location"} , {data: "Age"} , {data: "gender"} , {data: "education_level"} , {data: "marital_status"} , {data: "office_pos"} , {data: "email"}, {data: "membership_status"}, {data: "active_status"}, {data: "street_address"}, {data: "postcode"}, {data: "action"} ]
});
}

function searchAdultData(){

    var tablessp = initAdultTable();

    office_position_id = $('#office_position_id').val();
    membership_status_id = $('#membership_status_id').val();
    agency_id = $('#agency_id').val();
    company_id = $('#company_id').val();

    tablessp
    .columns(14).search(office_position_id)
    .columns(16).search(membership_status_id)
    .columns(7).search(agency_id)
    .columns(5).search(company_id)
    .draw(); 

}

function resetAdultData(){
    var tablessp = initAdultTable();
    $('#membersForm')[0].reset();

    tablessp.search('');
    tablessp.draw();
}

HTML: 

<div class="col-sm-12"> 

                <div class="row">
                    <div class="col-lg-12">
                        <button type="button" class="btn btn-primary btn-brand--icon" id="kt_search" onClick="searchAdultData();" style="width:100%;">
                            <span>
                                <i class="la la-search"></i>
                                <span>Search</span>
                            </span>
                        </button>

                        <button type="button" class="btn btn-warning btn-warning--icon" id="kt_reset" onClick="resetAdultData();" style="width:100%;">
                            <span>
                                <i class="la la-close"></i>
                                <span>Reset</span>
                            </span>
                        </button>
                    </div>
                </div>

</div>

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

Невозможно установить свойство 'data' со значением null

PHP: 

<?php 
       if ($this->input->is_ajax_request()) {
            /** this will handle datatable js ajax call * */
            /** get all datatable parameters * */

            $search = $this->input->get('search') ;/** search value for datatable  * */
            $offset = $this->input->get('start') ;/** offset value * */
            $limit = $this->input->get('length') ;/** limits for datatable (show entries) * */
            $order = $this->input->get('order') ;/** order by (column sorted ) * */
            $column = array('members.id', 'first_name', 'middle_name','last_name','phone_number','company_location','parent','agency_location','Age','gender','education_level','marital_status','office_pos','email', 'membership_status','active_status','street_address','postcode', 'action');/**  set your data base column name here for sorting* */

            //$column = array('id');/**  set your data base column name here for sorting* */
            $type = '';
            $orderColumn = isset($order[0]['column']) ? $column[$order[0]['column']] : 'members.id';
            $orderDirection = isset($order[0]['dir']) ? $order[0]['dir'] : 'desc';
            $ordrBy = $orderColumn . " " . $orderDirection;

            if (!empty($search['value'])) {
                $type="search";

                // RESULT SET WHEN QUERYING
                $sql = "SELECT members.`id`,`first_name`, `middle_name`,`last_name`, picture `Photo`, TIMESTAMPDIFF(YEAR, date_birth, CURDATE()) as `Age`, gender, marital_status, members.phone_number, members.email, setting_company.name as `company_name`, setting_office_position.title `office_pos`, setting_company_group._description `company_location`, setting_agency_parent.description `parent`, setting_agency_group.description `agency_location`, street_address , postcode, setting_occupation.title `job`, setting_membership_status.title `membership_status` , active_status, education_level FROM members
                ** VARIOUS_JOINS_GOES HERE **
                WHERE members.company_id = '$company_id' AND (members.membership_status != 10) AND members.age_group = 'Adults'
                AND (CONCAT(members.first_name, ' ' , members.middle_name, ' ', members.last_name  ) LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_company_group.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_office_position.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_membership_status.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_agency_group.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')

                order by " . $ordrBy . " limit $offset,$limit";

                // QUERY FOR COUNT OF ROWS
                $sql2 = "SELECT count(*) as `filtered` FROM members
                ** VARIOUS_JOINS_GOES HERE **
                WHERE members.company_id = '$company_id' AND (members.membership_status != 10) AND members.age_group = 'Adults'
                AND (CONCAT(members.first_name, ' ' , members.middle_name, ' ', members.last_name  ) LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_company_group.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_office_position.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_membership_status.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')
                OR (setting_agency_group.id LIKE '%" . $search['value'] . "%' AND members.company_id = '$company_id')

                order by " . $ordrBy;

                $result = $this->db->query($sql);
                $result2 = $this->db->query($sql2)->row();
                $count = $result2->filtered;
            } else {
                DEFAULT DATA WITHOUT FILTER HERE 
            }

Я удалил некоторые столбцы и части запросов, чтобы их было проще и практичнее просматривать.

Не уверен, что я делаю неправильно, я вижу, что данные 'm фильтрация добавляется к запросу в column[x][search][value] = 'search value', я могу предположить, что я делаю что-то не так на стороне PHP?

Стороннее примечание: Прежде чем кто-то укажет, я знаю, что здесь необходимо выполнить некоторые меры безопасности.

Ответы [ 2 ]

0 голосов
/ 07 ноября 2019

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

Вот код, который может быть вам полезен! 

<script type="text/javascript">
// define variable for table globally
var tablessp;
$(document).ready(function() {
   initAdultTable();
});

function initAdultTable () {
    // do not return anything here
    tablessp = $('#members').DataTable({
        // Your code
    });
}

function searchAdultData() {
    office_position_id = $('#office_position_id').val();
    membership_status_id = $('#membership_status_id').val();
    agency_id = $('#agency_id').val();
    company_id = $('#company_id').val();

    tablessp
        .columns(14).search(office_position_id)
        .columns(16).search(membership_status_id)
        .columns(7).search(agency_id)
        .columns(5).search(company_id)
        .draw(); 
}

function resetAdultData() {
    $('#membersForm')[0].reset();

    tablessp.search('');
    tablessp.draw();    
}
</script>
0 голосов
/ 06 ноября 2019

В вашей функции: initAdultTable() вы не возвращаете Datatable API, вместо этого вы всегда возвращаете true. return a = whatever; не вернет значение a, вернет boolean: true, поскольку оно успешно присвоило значение a.

. Это работает в первый раз, потому что вы вызвали initAdultTable () для документа, готового. Он получает данные и заполняет таблицу.

Во второй раз вы ожидаете, что он вернет набор данных, который вы хотите отсортировать / отфильтровать, но он просто заполняет все данные, как в первый раз, и возвращает true. Вы пытаетесь отсортировать boolean, поэтому возникает ошибка.

Измените функцию initAdultTable() следующим образом ... 

function initAdultTable() {
  return $('#members').DataTable({
     //......
  });
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...