Laravel-datatables: Soporta múltiples tablas de datos en la misma vista

Creado en 10 mar. 2017 · 3Comentarios · Fuente: yajra/laravel-datatables

Resumen del problema o solicitud de función

Tengo 2 tablas de datos que necesito mostrar en la misma página. Ya se están utilizando en su propia página, pero la página del panel de control deberá contener a ambos.

Los problemas que encuentro:

HtmlBuilder se basa en la tabla existente en lugar de comenzar a construir una nueva tabla
La representación del código HTML y el script en la vista entra en conflicto entre sí

Mis preguntas :

¿Puedo construir una segunda tabla usando HtmlBuilder?
¿Hay alguna manera de hacer que cada tabla sea única (¿con una ID?), Para que el HTML y el script renderizados funcionen en función de esa ID?

Fragmento de código del problema

En mi ServiceProvider:

    public function boot()
    {
        View::composer(['dashboard', 'user.index'], function(\Illuminate\View\View $view){
            $userTable = Datatables::getHtmlBuilder()
                ->addColumn(['data' => 'username', 'name' => 'username', 'title' => trans('messages.username')])
                ->addColumn(['data' => 'name_en', 'name' => 'name_en', 'title' => trans('messages.name (english)')])
                ->addColumn(['data' => 'name_jp', 'name' => 'name_jp', 'title' => trans('messages.name (japanese)')])
                ->addColumn(['data' => 'phone_number', 'name' => 'phone_number', 'title' => trans('messages.phone number')])
                ->addColumn(['data' => 'extension', 'name' => 'extension', 'title' => trans('messages.extension')])
                ->addAction([])
                ->ajax(route('user_index_data'))
            ;
            $view->with('userTable', $userTable);
        });

        View::composer(['dashboard', 'group.index'], function(\Illuminate\View\View $view) {
            $groupTable = DataTables::getHtmlBuilder()
                ->addColumn(['data' => 'username', 'name' => 'username', 'title' => trans('messages.group username')])
                ->addColumn(['data' => 'name', 'name' => 'name', 'title' => trans('messages.group name')])
                ->addColumn(['data' => 'users', 'name' => 'users', 'title' => trans('messages.active users')])
                ->addAction([])
                ->ajax(route('group_index_data'));
            $view->with('groupTable', $groupTable);
        });
    }

En el dashboard.blade.php

@section('content')
    <div class="row">
        <div class="col-sm-6 col-xs-12">
            {!! $userTable->table() !!}
            {!! $userTable->scripts() !!}
        </div>
    </div>
    <div class="row">
        <div class="col-sm-6 col-xs-12">
            {!! $groupTable->table() !!}
            {!! $groupTable->scripts() !!}
        </div>
    </div>
<strong i="20">@endsection</strong>

Detalles del sistema

Sistema operativo: Win 10 (Laragon 2.1.4)
Versión de PHP: 7.0.12
Versión de Laravel: 5.4.15
Versión de Laravel-Datatables: 7.3.0

Captura de pantalla

question

Fuente

Mopster

Todos 3 comentarios

Investigué un poco y encontré una manera de hacerlo funcionar.

Registro mis propios constructores:

    public function register()
    {
        $this->app->bind('datatables.html.userTable', function () {
            return $this->app->make(Builder::class);
        });
        $this->app->bind('datatables.html.groupTable', function () {
            return $this->app->make(Builder::class);
        });
    }

Luego, en el método de arranque () utilizo los constructores y configuro el atributo de tabla 'id':

    public function boot()
    {
        View::composer(['dashboard', 'user.index'], function(\Illuminate\View\View $view){
            $userTableBuilder = app('datatables.html.userTable');
            $userTable = $userTableBuilder
                ->setTableAttribute('id', 'userTable')
                ->addColumn(['data' => 'username', 'name' => 'username', 'title' => trans('messages.username')])
                ->addColumn(['data' => 'name_en', 'name' => 'name_en', 'title' => trans('messages.name (english)')])
                ->addColumn(['data' => 'name_jp', 'name' => 'name_jp', 'title' => trans('messages.name (japanese)')])
                ->addColumn(['data' => 'phone_number', 'name' => 'phone_number', 'title' => trans('messages.phone number')])
                ->addColumn(['data' => 'extension', 'name' => 'extension', 'title' => trans('messages.extension')])
                ->addAction([])
                ->ajax(route('user_index_data'))
            ;
            $view->with('userTable', $userTable);
        });

        View::composer(['dashboard', 'group.index'], function(\Illuminate\View\View $view) {
            $groupTableBuilder = app('datatables.html.groupTable');
            $groupTable = $groupTableBuilder
                ->setTableAttribute('id', 'groupTable')
                ->addColumn(['data' => 'username', 'name' => 'username', 'title' => trans('messages.group username')])
                ->addColumn(['data' => 'name', 'name' => 'name', 'title' => trans('messages.group name')])
                ->addColumn(['data' => 'users', 'name' => 'users', 'title' => trans('messages.active users')])
                ->addAction([])
                ->ajax(route('group_index_data'));
            $view->with('groupTable', $groupTable);
        });
    }

Captura de pantalla :

La búsqueda y la clasificación están funcionando.

Mopster en 10 mar. 2017

👍1

@Mopster Creo que también puedes usar debajo de app('datatables.html') :

 public function boot()
    {
        View::composer(['dashboard', 'user.index'], function(\Illuminate\View\View $view){
            $userTable = app('datatables.html')
                ->addColumn(['data' => 'username', 'name' => 'username', 'title' => trans('messages.username')])
                ->addColumn(['data' => 'name_en', 'name' => 'name_en', 'title' => trans('messages.name (english)')])
                ->addColumn(['data' => 'name_jp', 'name' => 'name_jp', 'title' => trans('messages.name (japanese)')])
                ->addColumn(['data' => 'phone_number', 'name' => 'phone_number', 'title' => trans('messages.phone number')])
                ->addColumn(['data' => 'extension', 'name' => 'extension', 'title' => trans('messages.extension')])
                ->addAction([])
                ->ajax(route('user_index_data'))
            ;
            $view->with('userTable', $userTable);
        });

        View::composer(['dashboard', 'group.index'], function(\Illuminate\View\View $view) {
            $groupTable = app('datatables.html')                
->addColumn(['data' => 'username', 'name' => 'username', 'title' => trans('messages.group username')])
                ->addColumn(['data' => 'name', 'name' => 'name', 'title' => trans('messages.group name')])
                ->addColumn(['data' => 'users', 'name' => 'users', 'title' => trans('messages.active users')])
                ->addAction([])
                ->ajax(route('group_index_data'));
            $view->with('groupTable', $groupTable);
        });
    }

El uso de Datatables::getHtmlBuilder() siempre devolverá una sola instancia, mientras que llamarlo en el IoC creará una nueva instancia.