Laravel-datatables: Necesita un filtro desplegable personalizado.

Creado en 25 oct. 2017  ·  12Comentarios  ·  Fuente: yajra/laravel-datatables

Resumen del problema o solicitud de función


Necesito el filtro de datos usando el menú desplegable personalizado. Tengo los datos que se muestran en forma correcta ahora necesito un menú desplegable personalizado en el encabezado para filtrar datos por valor desplegable [Nota: necesito proporcionar este valor desplegable para el filtro en la consulta de laravel. Este es un valor personalizado, por lo que necesito filtrar los datos utilizando este valor personalizado.]

Fragmento de código del problema

Este código funciona para el filtro predeterminado, pero he agregado el menú desplegable usando jquery, por lo que necesito pasar este valor en la consulta de laravel para filtrar los datos.

$(function () {
    var t = $('#user').DataTable({
        order: [[ 0, 'desc' ]],
        processing: true,
        serverSide: true,
        ajax: {
            url: '{!! route('datatables.data') !!}',
            data: function(d) {
                d.name = $('input[name=name]').val();
                d.email = $('input[name=email]').val();
            }
        },
        columns: [
            { data: 'id', name: 'id' },
            { data: 'name', name: 'name' },
            { data: 'email', name: 'email' },
            { data: 'arrival_date', name: 'arrival_date', orderable: true, searchable: true },
            { data: 'pick_up', name: 'pick_up', orderable: true, searchable: true },
            { data: 'destination', name: 'destination', orderable: true, searchable: true},
            { data: 'trekking_start_date', name: 'trekking_start_date', orderable: true, searchable: true},

            { data: 'trekking_end_date', name: 'trekking_end_date', orderable: true, searchable: true},
            { data: 'action', name: 'action', orderable: false, searchable: false},
        ]
    });
});

$(document).ready(function() {
    $('<label style="margin-left: 10px;">Filter by ' +
        '<select class="form-control input-sm">'+
            '<option value="volvo">Completed Trip</option>'+
            '<option value="saab">Upcoming Trip</option>'+
        '</select>' + 
        '</label>').appendTo("#user_wrapper #user_length");
});

Y mi código de consulta en laravel

public function getClients(Request $request)
    {
        if($request->ajax()) {
            return Datatables::of(DB::select(DB::Raw('SELECT * FROM users WHERE id NOT IN (SELECT user_id FROM role_user) ORDER BY users.id DESC')))
                    //}))
                    ->addColumn('arrival_date', function($user){
                        if(isset(Helper::getFlightsByClientID($user->id)->arrival_date)) {
                            return date('M j, Y', strtotime(Helper::getFlightsByClientID($user->id)->arrival_date));
                        } else {
                            return 'N/A';
                        }
                    })
                    ->addColumn('pick_up', function($user){
                        if(isset(Helper::getFlightsByClientID($user->id)->pick_up)) {
                            return Helper::getFlightsByClientID($user->id)->pick_up == 1 ? 'Yes' : 'No'; 
                        } else {
                            return 'N/A';
                        }
                    })
                    ->addColumn('destination', function($user){
                        if(isset(Helper::getTreksByClientID($user->id)->trekking_region_id)) {
                            return Helper::getTrekByID(Helper::getTreksByClientID($user->id)->trekking_region_id)->name; 
                        } else {
                            return 'N/A';
                        }
                    })
                    ->addColumn('trekking_start_date', function($user){
                        if(isset(Helper::getTreksByClientID($user->id)->trekking_start_date)) {
                            return date('M j, Y', strtotime(Helper::getTreksByClientID($user->id)->trekking_start_date));
                        } else {
                            return 'N/A';
                        }
                    })
                    ->addColumn('trekking_end_date', function($user){
                        if(isset(Helper::getTreksByClientID($user->id)->trekking_end_date)) {
                            return date('M j, Y', strtotime(Helper::getTreksByClientID($user->id)->trekking_end_date));
                        } else {
                            return 'N/A';
                        }
                    })
                    ->addColumn('action', function($user){
                        $html = '';
                        $html .= '<a class="btn bg-green btn-flat btn-xs" href="'.route('user.clients.edit', $user->id).'">Edit</a>';

                        if(auth()->user()->hasRole('superadmin')) {
                            $html .= ' <a onclick="if(!confirm(\'Are u sure to delete?\')) return false;" class="btn bg-red btn-flat btn-xs" href="'.route('user.clients.delete', $user->id).'">Delete</a>';
                        }

                        return $html;

                    })
                    ->make(true);
        } else {
            abort(400, 'Bad Request.');
        }
    }

Si corresponde, incluya una copia de su código que desencadena el error sospechoso. Puede usar las etiquetas de código php de Markdown para formatear su pegado: md5-29f7d4c1ff52f0e396b313bfe2550e56

Detalles del sistema

Incluya estos detalles sobre su sistema. Si se omiten, el ticket perderá prioridad sobre las solicitudes / tickets de otros usuarios.
  • Sistema operativo Ubuntu 16.04
  • Versión de PHP 7.0.22
  • Laravel Versión 5.4
  • Laravel-Datatables Versión 1.10.16

Screenshot

question

Comentario más útil

Debe activar la extracción cuando se cambia el filtro. Tal vez algo como:

<select class="form-control input-sm" id="custom-filter" onchange="$('#user').DataTable().draw()">

Además, está utilizando collection. Convertir

DB::select(DB::Raw('SELECT * FROM users WHERE id NOT IN (SELECT user_id FROM role_user) ORDER BY users.id DESC'))

A algo como:

DB::table('users')->whereNot(...);

Todos 12 comentarios

@shankhadevpadam , puede hacer esto de muchas maneras. Pero lo que hago es pasar el generador de consultas antes de las tablas de datos en el lado del servidor.


$model = new Example();
$model->where('column_to_filter','=',$this->request->get('filter_by'));

return datatables()->eloquent($model);

Por supuesto, puede hacer IF condicionales.


$model = new Example();

if($this->request->has('name')) {
     $model->where('name','=','predefined value');
}

return datatables()->eloquent($model);

Si no desea hacer el ejemplo anterior, puede consultar los documentos. Búsqueda de columna de publicación , filtro personalizado

Mi pregunta es cómo enlazar el menú desplegable como la imagen de arriba, lo he enlazado a través de jquery personalizado pero necesito enlazar usando la tabla de datos y este valor debería estar disponible cuando el menú desplegable cambie. [Por favor, mire mi fragmento de código]

Agregue id en el cuadro de selección.

<select class="form-control input-sm" id="custom-filter">

Luego inclúyalo en los parámetros de solicitud.

        ajax: {
            url: '{!! route('datatables.data') !!}',
            data: function(d) {
                d.name = $('input[name=name]').val();
                d.email = $('input[name=email]').val();
                d.filter = $('#custom-filter').val();
            }
        },

Luego haga el filtro necesario en el lado del servidor.

if ($filter = request('filter')) {
    $query->where('filter', $filter);
}

Debe activar la extracción cuando se cambia el filtro. Tal vez algo como:

<select class="form-control input-sm" id="custom-filter" onchange="$('#user').DataTable().draw()">

Además, está utilizando collection. Convertir

DB::select(DB::Raw('SELECT * FROM users WHERE id NOT IN (SELECT user_id FROM role_user) ORDER BY users.id DESC'))

A algo como:

DB::table('users')->whereNot(...);

Gracias ahora trabajando.

Bienvenido, no olvides destacar el proyecto si lo encuentras útil. :) ¡Gracias!

El menú desplegable funciona perfectamente, pero los datos que se muestran después del cambio de valor en el menú desplegable no se ordenan correctamente.

Screenshot

¿Quiere ordenar por fecha cuando se filtra? Necesita hacer esto en el nivel js . O establezca el orden predeterminado para esa columna.

Si, cualquier ejemplo por favor.

No tengo ningún ejemplo. Consulte los documentos oficiales de js api https://datatables.net/reference/api/ para obtener una referencia. El truco consiste en ejecutar un comando de orden js manual antes de realizar la función de redibujo de la tabla.

@yajra ¿Cómo implementar equivalentes en tablas de datos como servicio?

            data: function(d) {
                d.name = $('input[name=name]').val();
                d.email = $('input[name=email]').val();
                d.filter = $('#custom-filter').val();
            }

@sistemaswebbrasil usando minifiedAjax() :

$script = '
data.name = $('input[name=name]').val();
data.email = $('input[name=email]').val();
data.filter = $('#custom-filter').val();
';

return $this
            ->builder()
            ...
            ->minifiedAjax($url = '', $script = null, $data = [])
¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

hari-web picture hari-web  ·  3Comentarios

hohuuhau picture hohuuhau  ·  3Comentarios

techguydev picture techguydev  ·  3Comentarios

kamrava picture kamrava  ·  3Comentarios

Mopster picture Mopster  ·  3Comentarios