0

Tengo el siguiente código javascript (usando jquery) donde muestro en una ventana modal una tabla (dataTable) con datos obtenidos con ajax.

Tengo en la última columna un botón de "agregar" con el que agrego a un formulario los datos seleccionados de la tabla en la ventana modal. La primera vez que lo ejecuto todo funciona bien pero (sin refrescar la ventana), al hacer clic nuevamente en el botón agregar me dice que no está definida la variable data.

Al cargar la ventana Modal tengo que utilizar el método destroy en la Datatable, porque si no me salta el error de que no se puede inicializar, etc, etc...

Sé que el tema pasa por allí pero no sé cómo hacer para que funcione.

Código javascript:

/*---------------------------------------------------------*/
/* Muestra una Ventana Modal Con Clientes para seleccionar */
/*=========================================================*/
buscarCliente = function(){
    var cmdModal = $("#buscar").on("click", function () {
        $('#modBuscaCliente').modal({show: true});
        $('#tBusqueda').DataTable().destroy();
        var table = $('#tBusqueda').DataTable({
            "destroy": true,
            "ajax": {
                "method": "get",
                "url": "/buscacliente/"
            },
            "language": {"url": "/json/datatables/Spanish.json"},
            "lengthMenu": [[5, 10], [5, 10]],
            "columns": [
                {"data": "nrocliente"},
                {"data": "cliente"},
                {"data": "domicilio"},
                {
                    "defaultContent": "<button type='button' class='selec btn btn-primary sm'></button>",
                    "className": "text-center"
                }
            ],
            "columnDefs": [
                {"bSortable": false, "targets": 3}, {"width": "10%", "targets": [0]},
                {"title": "N&#176;", className: "center", "targets": [0]}
                /*{ "title": "S", className: "center", "targets": [3]}*/
            ]
        });
        obtenerDatosCliente("#tBusqueda tbody",table);
    })
    /*==================================================================*/
    var obtenerDatosCliente = function(tbody,table){
        $(tbody).on("click","button.selec", function(){
            var datos = table.row($(this).parents("tr")).data();
            console.log( datos );

            var idCliente =   $("#idCliente").val(datos.idcliente),
                cliente =     $("#txtCliente").val(datos.cliente),
                nroCliente =  $("#txtNroCliente").val(datos.nrocliente),
                domicilio =   $("#txtDireccion").val(datos.domicilio);
        });
    }
    /*===================================================================*/
} // Fin Buscar Cliente

1 respuesta 1

1

Es que no tienes definida la variable data en tu columna, te paso el ejemplo de DataTable y veras que se define como nula la variable data.

 $(document).ready(function() {
 var table = $('#example').DataTable( {
     "ajax": "data/arrays.txt",
     "columnDefs": [ {
         "targets": -1,
         "data": null,
         "defaultContent": "<button>Click!</button>"
     } ]
 } );

 $('#example tbody').on( 'click', 'button', function () {
     var data = table.row( $(this).parents('tr') ).data();
     alert( data[0] +"'s salary is: "+ data[ 5 ] );
 } );
} );

Inicializa la variable a nulo y debria funcionar.

Mi consejo es el siguiente: Inicializa la variable data con "nrocliente" y asi cuando se lo pases al button tendras en el contexto del Buttom que has agregado el ID del usuario que deseas agregar, porque no se exactamente de donde sacas los datos para el modal.

Espero que te sirva de ayuda.

2
  • 1
    Muchas gracias por tu respuesta, pero no me funciona.... Ahora lo que veo que en ejemplo que tu me has pasado define el botón en el "columnDefs" y yo lo tengo definido en el "column". Perdón por mi ignorancia pero será por eso??? lo que si hace es que si... si no le pongo el "destroy": true, me salta el error de que debo inicializar la tabla pero no me sale le error que la variable no esta definida.... Gracias...!!!
    – Juan Angel
    Commented el 17 ene. 2018 a las 20:06
  • Intenta actualizar el hilo con el codigo y le hago un trackeo de eso, pero el fallo justo como lo describes suena a que no tienes inicializada la tabla a la que apuntas con el $("#idDeEjemplo"), mira a ver si estas apuntando bien el id de la tabla o que el cuerpo de la tabla es correcto. No obstance actualiza tu problema para que yo u otro pueda resolverlo. Saludos :) Commented el 18 ene. 2018 a las 12:57

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.