2

Tengo una tabla con botones Toggle

El código de la tabla es el siguiente:

$('#table').DataTable({
                "destroy": true,
                "responsive": true,
                "processing": true,
                "serverSide": true,
                "ajax": "tabla/cargos",
                "columns": [
                    {
                        sortable: false,
                        "render": function ( data, type, full, meta ) {
                            return meta.row+1;
                        }
                    },
                    {'data': 'nombre'},
                    {'defaultContent':  '<button type="button" class="editar edit-modal btn btn-info ">'+
                                            '<span class="fa fa-edit"></span> Editar'+
                                        '</button> '+
                                        '<button type="button" class="eliminar delete-modal btn btn-danger">'+
                                            '<span class="fa fa-trash"></span> Eliminar'+
                                        '</button>'
                    },
                    {
                        sortable: false,
                        "render": function ( data, type, full, meta ) {
                            if(full.status){
                                return '<input type="checkbox" checked data-toggle="toggle" data-on="Ready" data-off="Not Ready" data-onstyle="success" data-offstyle="danger">'
                            }else{
                                return '<input type="checkbox" data-toggle="toggle" data-on="Ready" data-off="Not Ready" data-onstyle="success" data-offstyle="danger">'
                            }
                        }
                    },
                ]
            });

Pero la tabla no me carga los botones, en cambio, si los coloco afuera si me carga el aspecto de a libreria Bootstrap Toggle.

1 respuesta 1

3

Se agrega la funcion despues que termine la creación del "datetables". Queda de la siguiente manera:

$('#table').DataTable({
                "destroy": true,
                "responsive": true,
                "processing": true,
                "serverSide": true,
                "ajax": "tabla/cargos",
                "columns": [
                    {
                        sortable: false,
                        "render": function( data, type, full, meta ){
                            return meta.row+1;
                        }
                    },
                    {'data': 'nombre'},
                    {'defaultContent':  '<button type="button" class="editar edit-modal btn btn-info ">'+
                                            '<span class="fa fa-edit"></span> Editar'+
                                        '</button> '+
                                        '<button type="button" class="eliminar delete-modal btn btn-danger">'+
                                            '<span class="fa fa-trash"></span> Eliminar'+
                                        '</button>'
                    },
                    {data: 'status', render: function( data, type, row ){
                            if (data) {
                                return '<input id="toggle-demo" name="my-checkbox" type="checkbox" checked data-toggle="toggle" data-on="Activo" data-off="Inactivo" data-onstyle="success" data-offstyle="danger">';
                            }else {
                                return '<input id="toggle-demo" name="my-checkbox" type="checkbox" data-toggle="toggle" data-on="Activo" data-off="Inactivo" data-onstyle="success" data-offstyle="danger">';
                            }
                        }
                    } ,
                ],
                "fnDrawCallback": function() {
                    $("[name='my-checkbox']").bootstrapToggle();
                }
            });

Probado y funcionando. Gracias de igual manera.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.