1

De antemano les agradezco cualquier ayuda o recomendacion que me puedan proporcionar.

estoy trabajando con la siguiente tabla:

introducir la descripción de la imagen aquí

La cual creo dentro de mi document ready de la siguente manera:

document.ready(function(){
        var table = null;

        $.ajax({
            url: "@Url.Action("getRequest", "verRequest")",
            type: 'post',
            datatype: 'application/json',
            data: {
                role: role
                , date: date
                , status: status
            },
            success: function (data) {
                if (data.length == 0) {
                    swal('Nothing was found',
                        '',
                        'error');
                } else {
                    data.forEach(element => {
                        element.request.dateRquest = new Date(element.request.dateRquest.match(/\d+/)[0] * 1).toLocaleDateString();
                    });

                    table = $('#table').DataTable({
                        'data': data
                        , 'columns': [
                            {
                                'className': 'details-control',
                                'orderable': false,
                                'data': null,
                                'defaultContent': ''
                            },
                            {
                                'className': 'idRequest',
                                "targets": [1],
                                "visible": false,
                                'data': 'request.idRequest',
                            },
                            { 'data': 'nombre' },
                            { 'data': 'request.dateRquest' },
                            { 'data': 'estatus' },
                            {
                                "className": '',
                                "orderable": false,
                                "data": null,
                                "render": function (data, type, row) {
                                    if (data.estatus == 'Pendiente') {
                                        return '<button class= "btn btn-success btn-circle asignar" title="Asignar"> <i class="material-icons">assignment_ind</i></button>' +
                                            "&nbsp;" +
                                            '<button class= "btn btn-danger btn-circle rechazar" title="Rechazar"> <i class="material-icons">close</i></button>'
                                    } else if (data.estatus == 'En Proceso' &&
                                        (data.request.wiwResponsable.trim().toLowerCase() == '@Request.Cookies["PFEPCoockie"]["wiw"].ToLower()'
                                            || @Request.Cookies["PFEPCoockie"]["idRole"] < 4)) {
                                        return '<button class= "btn btn-success btn-circle terminar" title="Terminar"> <i class="material-icons">assignment_turned_in</i></button>'
                                    } else if (data.estatus == 'Rechazado') {
                                        return '<h6 class = "text-danger">SOLICITUD RECHAZADA</h6>'
                                    }

                                },
                                "defaultContent": ''
                            },
                        ],
                        'order': [[1, 'asc']]
                    });
                }
            }
        });    
});

dentro de mi document ready tambien declaro la funcion correspondiente al boton verde del lado derecho que se puede apreciar en la imagen, esta funcion la declaro de la siguiente manera:

$(document).on('click', '#table tbody tr button.terminar', function () {
    table.row($(this).parent().closest('tr')).data()
});

pero obtengo el siguiente error:

verRequest:536 Uncaught TypeError: Cannot read property 'row' of null
    at HTMLButtonElement.<anonymous> (verRequest:536)
    at HTMLDocument.dispatch (jquery.js:5183)
    at HTMLDocument.elemData.handle (jquery.js:4991)

Y si hago algo como esto:

$(document).on('click', '#table tbody tr button.terminar', function () {
    $('#table').row($(this).parent().closest('tr')).data()
});

obtengo el siguiente error:

verRequest:536 Uncaught TypeError: $(...).row is not a function
    at HTMLButtonElement.<anonymous> (verRequest:536)
    at HTMLDocument.dispatch (jquery.js:5183)
    at HTMLDocument.elemData.handle (jquery.js:4991)

¿De que manera deberia de llamar la funcion row() o declarar mi variable table para que esto funcionara?

1 respuesta 1

2

Según la documentación, debes llamar a la función row sobre el resultado de la función DataTable.

Entonces,

$(document).on('click', '#table tbody tr button.terminar', function() {
    $('#table').DataTable().row($(this).parent().closest('tr')).data()
});

Así quedaría el código.

Espero que sirva.

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.