Laravel-datatables: Использование настраиваемого фильтра в Datatable как реализация услуги

Созданный на 28 февр. 2016  ·  16Комментарии  ·  Источник: yajra/laravel-datatables

Может ли кто-нибудь объяснить мне на простом примере, как реализовать настраиваемый фильтр в Datatable как реализацию службы. Я ничего не мог понять из уроков.

question

Самый полезный комментарий

Я просто оставлю это здесь для всех, кому интересно;)

Javascript

$(document).ready(function () {
    $('.js-datatable-filter-form :input').on('change', function (e) {
        window.LaravelDataTables["dataTableBuilder"].draw();
    });

    $('#dataTableBuilder').on('preXhr.dt', function ( e, settings, data ) {
        $('.js-datatable-filter-form :input').each(function () {
            data[$(this).prop('name')] = $(this).val();
        });
    });
});

Дополнительные данные фильтра можно получить с помощью функции request() . Используя область видимости, результаты можно фильтровать в серверной части.

Примеры объемов:

Архивный объем

<?php namespace App\DataTables\Scopes;

use Yajra\Datatables\Contracts\DataTableScopeContract;

class ArchivedScope implements DataTableScopeContract
{
    public function apply($query)
    {
        $query->onlyTrashed();

        return $query;
    }
}

Пример метода контроллера:

public function archived(UserDataTable $dataTable)
{
    $dataTable->addScope(new App\DataTables\Scopes\ArchivedScope());

    return $dataTable->render('admin.users.index');
}

Объем ролей

Обратите внимание на request() функции в apply метода здесь.

<?php namespace App\DataTables\Scopes;

use Yajra\Datatables\Contracts\DataTableScopeContract;

class RoleScope implements DataTableScopeContract
{
    public function apply($query)
    {
        if ($roleId = request('role_id')) {
            $query->where('role_id', $roleId);
        }

        return $query;
    }
}

Более подробную информацию об объемах можно найти здесь: https://datatables.yajrabox.com/services/scope

Все 16 Комментарий

Позвольте мне попробовать, могу ли я вам это объяснить.

В вашем классе службы DT у вас есть метод ajax() который обрабатывает ответ ajax json на стороне клиента. Это место, где вы трансформируете свой json-ответ, редактируя / добавляя столбец и т. Д.

Другой метод - это метод query() который обрабатывает ваш базовый запрос для использования DT. В классе есть метод request() , который можно использовать для доступа к экземпляру Request . См. Пример фрагмента ниже:

    public function ajax()
    {
        return $this->datatables
            ->eloquent($this->query())
            ->addColumn('action', 'audits.audit.datatables.action')
            ->make(true);
    }

    public function query()
    {
        $audits = Audit::query();

        if ($this->request()->get('auditType')) {
            $audits->where('type', $this->request()->get('auditType'));
        }

        return $this->applyScopes($audits);
    }

Надеюсь это поможет. В ближайшее время постараюсь добавить еще демо по реализации услуги.

Благодарю. Я получил эту роль. Можете ли вы сказать мне, как отправить данные ajax от клиента, а затем перерисовать таблицу?

Подключите свой js к событию preXHR DT, чтобы передать пользовательские данные на сервер. https://datatables.net/reference/event/preXhr

Теперь настраиваемый фильтр работает, но нумерация страниц с ним не работает.

Спасибо, решил.

Привет Могу я увидеть пример ???

См. Приведенный выше фрагмент кода @yajra. Или, если вы ищете фрагмент кода JavaScript, скажите мне.

в приведенном выше примере запроса с 'auditType' - откуда это опубликовано? клинок? его можно выложить с контроллера?

Вот пример кода из Javascript:

$ ('# dataTableBuilder')
.on ('preXhr.dt', function (e, settings, data) {
data.auditType = $ ('ввод [имя = auditType'). val ();
});

<input type="text" onchange="abc(this.value)" >

    function abc(a) {
        $('.datatable')
        .on('preXhr.dt', function ( e, settings, data ) {
            data.auditType = a;
        });
    }

сэр, я тоже использую службу данных, почему я не могу загрузить данные после изменения ..

Привет, я делаю следующее: я ловлю событие изменения и нажимаю кнопку перезагрузки на datatable, например:

$ (селектор) .on ('изменить', function () {
$ ('. кнопки-перезагрузить'). click ();
});

Я не совсем уверен, что это правильный способ обновить таблицу, но он работает.

Привет, не могли бы вы мне помочь? Кто делает запрос в этом случае.
Мой взгляд:
<input type="text" name="abc"> <div class="col-md-12"> {!! $dataTable->table(['style'=>'width:100%', 'class'=>'table table-striped table-hover']) !!} </div>
ClientsDataTable:
`
запрос публичной функции ()
{
$ workstation_id = Auth :: user () -> activeWorkstation () -> id;

    $clients = Client::where('workstation_id', $workstation_id)->with('addresses')->with('devices');

    if ($this->request()->get('abc')) {
        $clients->where('name', $this->request()->get('abc'));
    }


    return $this->applyScopes($clients);
}

JS:

$('#dataTableBuilder').on('preXhr.dt', function ( e, settings, data ) {
    data.abc= $('input[name=abc]').val();
});

`

Пожалуйста, помогите, я не знаю, кто должен отправлять запрос.

Datatable делает запрос каждый раз, когда вы меняете значения в своем настраиваемом фильтре.

Вам нужно поймать событие change, keyup или keydown на входе, например:
$(selector).on('change',function(){ $('.buttons-reload').click(); });

Кнопка-перезагрузка - это кнопка, которую вы настраиваете для класса данных:
public function html() { return $this->builder() ->columns($this->getColumns()) ->addAction(['width' => '35%']) ->parameters([ 'language' => [ 'url' => '//cdn.datatables.net/plug-ins/1.10.11/i18n/Spanish.json' ], "lengthMenu" => [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]], "pagingType" => "full_numbers", 'dom' => 'lBfrtip', 'scrollX' => true, **'buttons' => [ 'reload' ],** ]); }

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

У меня это работает, но, возможно, это лучший способ заставить его работать.

Здравствуй,
Он перезагрузил запрос, но без переданных данных. Любое предложение?

Оно работает!!! Извините, я забыл добавить preXhr.dt в событие «при изменении», например:
$('input[name=abc]').on('change',function(){ $('#dataTableBuilder').on('preXhr.dt', function ( e, settings, data ) { data.abc= $('input[name=abc]').val(); }); $('.buttons-reload').click(); });

Я просто оставлю это здесь для всех, кому интересно;)

Javascript

$(document).ready(function () {
    $('.js-datatable-filter-form :input').on('change', function (e) {
        window.LaravelDataTables["dataTableBuilder"].draw();
    });

    $('#dataTableBuilder').on('preXhr.dt', function ( e, settings, data ) {
        $('.js-datatable-filter-form :input').each(function () {
            data[$(this).prop('name')] = $(this).val();
        });
    });
});

Дополнительные данные фильтра можно получить с помощью функции request() . Используя область видимости, результаты можно фильтровать в серверной части.

Примеры объемов:

Архивный объем

<?php namespace App\DataTables\Scopes;

use Yajra\Datatables\Contracts\DataTableScopeContract;

class ArchivedScope implements DataTableScopeContract
{
    public function apply($query)
    {
        $query->onlyTrashed();

        return $query;
    }
}

Пример метода контроллера:

public function archived(UserDataTable $dataTable)
{
    $dataTable->addScope(new App\DataTables\Scopes\ArchivedScope());

    return $dataTable->render('admin.users.index');
}

Объем ролей

Обратите внимание на request() функции в apply метода здесь.

<?php namespace App\DataTables\Scopes;

use Yajra\Datatables\Contracts\DataTableScopeContract;

class RoleScope implements DataTableScopeContract
{
    public function apply($query)
    {
        if ($roleId = request('role_id')) {
            $query->where('role_id', $roleId);
        }

        return $query;
    }
}

Более подробную информацию об объемах можно найти здесь: https://datatables.yajrabox.com/services/scope

Была ли эта страница полезной?
0 / 5 - 0 рейтинги