Ver Mensaje Individual
  #4 (permalink)  
Antiguo 30/03/2021, 14:47
Avatar de emilio_viguri
emilio_viguri
 
Fecha de Ingreso: junio-2011
Ubicación: Mexico
Mensajes: 116
Antigüedad: 12 años, 10 meses
Puntos: 3
Información Respuesta: Busqueda personalisada con input resultado en DataTable

Ya lo solucione no se si sea la mejor manera de mandar las cosas por el ajax DataTable pero ya me funciona

Primero cambie el type = submit del botón? y le puse type = button en mi linea 5 del HTML

Código HTML:
Ver original
  1. <button type="button" id="btnBuscar">Busca ya</button>

Para mandar los datos no pude con var formDatos = new FormData($("#formBuscar")[0]) no pude lo puse así pero no funciono:
Código Javascript:
Ver original
  1. var formDatos = new FormData($("#formBuscar")[0]); //Para obtener los datos del FormID
  2.   DataTable = $('#DataTable').dataTable({
  3.     "aProcessing": true, //Activa el procedimietno del DataTables
  4.     "aServerSide": true, //Paginación y filtrado realizados por el servidor
  5.     dom: 'Bfrtip', //Definimos los elementos del control de tabla
  6.     buttons:['copyHtml5','excelHtml5','csvHtml5','pdf'],
  7.     "ajax":{
  8.       url: 'ajax/buscar.php?op=Buscar', //Obtener los valores desde url
  9.       type: "POST",
  10.       data: formDatos, //La variable var formData = new FormData mas arriba
  11.       dataType: "json", //Datos codificados mediante json
  12.       error:function(e){ //en caso de errores
  13.         console.log(e.responseText);
  14.       }
  15.     },

Mejor las mando por GET no se si fuera lo mejor que opinan y agregue una linea "destroy": true, para evitar un error que me daba el DataTable.
DataTables warning: table Cannot reinitialise DataTable.

Y así esta solucionado ....

Código Javascript:
Ver original
  1. function listarRegistros(){
  2.   var c = $('#buscar').val();
  3.   var fi = $('#fechainicio').val();
  4.   var ff = $('#fechafin').val();
  5.  
  6.   DataTable = $('#DataTable').dataTable({
  7.     "aProcessing": true, //Activa el procedimietno del DataTables
  8.     "aServerSide": true, //Paginación y filtrado realizados por el servidor
  9.     dom: 'Bfrtip', //Definimos los elementos del control de tabla
  10.     buttons:['copyHtml5','excelHtml5','csvHtml5','pdf'],
  11.     "ajax":{
  12.       url: 'ajax/' +ajaxFile+ '.php?op=Buscar&c='+c+'&fi='+fi+'&ff='+ff, //Obtener los valores desde url
  13.       type: "get",
  14.       dataType: "json", //Datos codificados mediante json
  15.       error:function(e){ //en caso de errores
  16.         console.log(e.responseText);
  17.       }
  18.     },
  19.     "bBestroy": true,
  20.     "destroy": true,
  21.     "iDisplayLength": 10, //Paginacion de X en X registros.
  22.     "order": [[0, "desc"]] //Ordenar (columna,orden).
  23.   }).DataTable();
  24. }
__________________
Ing. Emilio Viguri de NEXCEN Visitamos en lo que podamos ayudarte.