Posted in

DataTables evento al paginar, filtrar y ordenar

Si usamos, por ejemplo, bootstrap editable para editar campos inline y estos están dentro de una tabla que usa DataTables, seguramente nos hemos encontrado con el problema que al filtrar o paginar los resultados, desaparece la opción de edición. Esto lo solucionaremos cargando (en este caso) el código del Bootstrap editable mediante la propiedad “DrawCallback” de la siguiente forma:

$('#state-saving-datatable').DataTable({
            stateSave: true,
            language: {
                url: '{{ url("assets-backoffice/libs/datatables/i18n/ca.json") }}'
            },
            "drawCallback": function () {
                $('.dataTables_paginate > .pagination').addClass('pagination-rounded');

                $(function() {
                    $.fn.editableform.buttons =
                        '<button type="submit" class="btn btn-primary editable-submit btn-sm waves-effect waves-light"><i class="mdi mdi-check"></i></button>' +
                        '<button type="button" class="btn btn-danger editable-cancel btn-sm waves-effect"><i class="mdi mdi-close"></i></button>';

                    $.fn.editable.defaults.params = function (params) {
                        params._token = $("meta[name=_token]").attr("content");
                        return params;
                    };

                    $('.text-box').editable({
                        type: 'text',
                        pk: 1,
                        name: 'title',
                        title: 'Enter username',
                        mode: 'inline',
                        inputclass: 'form-control-sm',
                        validate: function(value) {
                            if($.trim(value) == '') return '{{ trans('elements.field-required') }}';
                        },
                    });
                });
            }
        });

Deixa un comentari

L'adreça electrònica no es publicarà. Els camps necessaris estan marcats amb *


The reCAPTCHA verification period has expired. Please reload the page.