0

Estoy utilizando un datatable para mostrar información general. Este datatable se carga con información solicitada a una base de datos, no de información de columnas a través de etiquetas <td> </td>.

Mi problema es que quiero utilizar filtros por columna a través de select, estoy utilizando el ejemplo que se indica en la página principal de datatables; sin embargo no se muestra información en cada select y no encuentro la manera de solucionarlo por más que he investigado.

Extracto del código:

<div class="table-responsive col-sm-12">
<table id="dt_actividad" class="table table-borderer table hover" cellspacing="0" width="100%">
  <thead>
    <tr>
      <th>ID act.<i class="fa fa-fw fa-caret-down"></th>
      <th>Colaborador<i class="fa fa-fw fa-caret-down"></th>
      <th>RQ<i class="fa fa-fw fa-caret-down"></th>
      <th>Tipo Act.<i class="fa fa-fw fa-caret-down"></th>
      <th>Solic.<i class="fa fa-fw fa-caret-down"></th>
      <th>Detalle RQ<i class="fa fa-fw fa-caret-down"></th>
      <th>Estado<i class="fa fa-fw fa-caret-down"></th>
      <th>Fec. reg.<i class="fa fa-fw fa-caret-down"></th>
      <th>Fec. ent.<i class="fa fa-fw fa-caret-down"></th>
      <th>Observaciones<i class="fa fa-fw fa-caret-down"></th>
      <th>Registra<i class="fa fa-fw fa-caret-down"></th>
      <th>Hora<i class="fa fa-fw fa-caret-down"></th>
      <th>fec_real<i class="fa fa-fw fa-caret-down"></th>
      <th></th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th ></th>
      <th>Colaborador</th>
      <th>RQ</th>
      <th>Tipo Act.</th>
      <th>Solic</th>
      <th>Detalle RQ</th>
      <th>Estado</th>
      <th>Fec. reg.</th>
      <th>Fec. ent.</th>
      <th>Observaciones</th>
      <th>Registra</th>
      <th>Hora</th>
      <th>fec_real</th>
    </tr>
  </tfoot>
  </tbody>
</table>

script

imagen del datatable

7
  • mira en la consola y muéstranos el error que te sale Commented el 2 ago. 2019 a las 17:20
  • 1
    Saludos primero verifica el orden de tus tags primero va "thead" luego "tbody" y al final "tfoot".. Commented el 2 ago. 2019 a las 17:22
  • 1
    La etiqueta <i> debe tener cierre </i> por favor revisa eso. Commented el 2 ago. 2019 a las 17:57
  • Agrega el código completo a la pregunta para verificar que puede estar fallando. Revisa las observaciones que te hacen el los comentarios anteriores. Pásate por esta sección para que sepas como elaborar una pregunta que sea bien recibida por la comunidad.
    – DjCrazy
    Commented el 2 ago. 2019 a las 18:10
  • En consola si hay un error : Uncaught SyntaxError: Unexpected token { jquery.dataTables.min.css:1, ya lo habilité pero no hay cambio. Commented el 2 ago. 2019 a las 18:23

1 respuesta 1

1

El problema parece agregarse cuando trae datos desde la BD, según el comentario que dejaste en tu pregunta.

El < tbody >< /tbody > lo tengo vacío ya que lo carga la info de la BD

Si el código que agrega la info desde la BD está agregando los tags <TBODY> y </TBODY> entonces deberías eliminar el cierre de la anteúltima línea:

  <thead>
    <tr>
      <!-- tags <th></th> del head -->
    </tr>
  </thead>
  <tfoot>
    <tr>
      <!-- tags <th></th> del foot -->
    </tr>
  </tfoot>
  <!-- </tbody> no puedo cerrar un tbody que no abrí -->
</table>

Si tu código sólo agrega el tag de apertura, entonces deberías mover el cierre a la línea anterior a abrir el <TFOOT>

Por ejemplo:

  <thead>
    <tr>
      <!-- tags <th></th> del head -->
    </tr>
  </thead>
  </tbody> <!-- cierro el tbody que abrí al traer info de la BD -->
  <tfoot>
    <tr>
      <!-- tags <th></th> del foot -->
    </tr>
  </tfoot>
  <!-- </tbody> no puedo cerrar un tbody que no abrí -->
</table>

Por último, si tu código no agrega el tag de apertura ni el de cierre, entonces deberías agregar los dos tags en tu código o en el HTML.

Por ejemplo:

  <thead>
    <tr>
      <!-- tags <th></th> del head -->
    </tr>
  </thead>
  <tbody></tbody> <!-- abro y cierro el tbody. se completa al traer info de la BD -->
  <tfoot>
    <tr>
      <!-- tags <th></th> del foot -->
    </tr>
  </tfoot>
  <!-- </tbody> no puedo cerrar un tbody que no abrí -->
</table>
2
  • si correcto, yo normalice lo que indicas y el error continua, el datatable tiene información pero los select no muestran nada. Si elimino el llamado de la BD y genero un <tbody><tr><td></td></tr></tbody> y le agrego datos manuales, los select funcionan perfectamente. Aun no comprendo que pueda estar generando que los select no carguen información con los datos provenientes de la BD. Agradezco tus comentarios, saludos Commented el 2 ago. 2019 a las 21:39
  • @ChristianPortuguezLeón Postea lo que ves con Ver código fuente desde un navegador cuando cargas la página, así vemos dónde está agregando algo que no va o en el orden equivocado.
    – Ado Peder
    Commented el 4 ago. 2019 a las 1:37

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.