Es posible ocultar una tabla cuando no tiene ningún tipo de datos(filas) en el interior?
Estoy usando la consulta de tablas de datos plugin.

No pude encontrar ninguna opción en el documentación.

InformationsquelleAutor ocanal | 2013-10-10

7 Comentarios

  1. 8

    A pesar de las buenas sugerencias, creo que aún existe la necesidad de (otro) respuesta.

    1. El uso de tablas de datos de una <table> nunca estará vacío o :empty – desde tablas de datos exige que usted tenga una <thead> y un <tbody>

    2. No es suficiente para ocultar la <table>, debe ocultar la *_wrappper también – la <div> que contiene el estilo de la tabla, la paginación, filtro de caja y así sucesivamente.

    Usted puede tomar ventaja de fnInitComplete :

    $('#table').dataTable({
       //initialization params as usual
       fnInitComplete : function() {
          if ($(this).find('tbody tr').length<=1) {
             $(this).parent().hide();
          }
       } 
    });

    Esto ocultará el dataTable y todo su contenido autogenerado, si no hay filas de retención de datos en <tbody>.


    Actualización

    [Ver los comentarios de aclaración], Entonces usted necesita un totalmente otro enfoque. Esto funciona en Chrome y FireFox, no puede decir por EJEMPLO :

    Olvidarse de fnInitComplete, utilizar el siguiente código :

    var dataTable = $('#table').dataTable();
    
    $("#table").on('DOMNodeInserted DOMNodeRemoved', function() {
      if ($(this).find('tbody tr td').first().attr('colspan')) {
        $(this).parent().hide();
      } else {
        $(this).parent().show();
      }
    });
    
    //this shows the dataTable (simplified)
    dataTable.fnAddData(
        ['a','b','c','d','e']
    );
    
    //this hides it (assuming there is only one row)
    dataTable.fnDeleteRow(0);
    • Esta es una respuesta mejor, pero todavía hay un problema. Puedo agregar o quitar tr de forma dinámica, por lo que es posible hacer que funcione en cada manipulación de datos? Cuando elimino la última fila de la tabla que debe estar oculto o cuando agrego la primera fila de la tabla debe ser demostrado.
    • está usted usando fnAddData / fnDeleteRow?
  2. 2

    He encontrado que esto funciona así:

    $('#table').dataTable({
        fnDrawCallback : function() {
            if ($(this).find('.dataTables_empty').length == 1) {
               $(this).parent().hide();
            }
        }
    });

    Advertencia: Si realiza una búsqueda y los resultados no se volverá a ocultar toda la tabla.

    • Esto funciona bien. Es posible que desee agregar en } else { $(this).parent().show(); } a traer la vuelta a la tabla, al despejar el campo de búsqueda.
  3. 1

    Con tablas de datos, se insertará una fila que indica que no hay datos para mostrar, por lo que deberá comprobar que. Directamente después de su llamada para rellenar la tabla, agregar esta…

    if ($(".dataTables_empty").length) {
        $(".dataTables_wrapper").hide();
    }
  4. 1
    if($('#mytable tbody .dataTables_empty').length){
        $('#mytable_wrapper').hide()
    }

    ver sólo porque mi id es mytable el contenedor se llama mytable_wrapper así que si su id de tabla esbla será bla_wrapper

  5. 0

    Si quieres ocultar tabla, cuando no hay ningún niño etiquetas en él (me refiero a cuando es ) puede utilizar pseudoclass :empty de css.

    Algo así como que:

    table:empty {display: none}

  6. 0

    Hice con el acto del sorteo, por cada vez que mi datatable cambios comprueba si tiene datos:

    var table = $('#example').DataTable();
    
    table.on('draw', function () {
        if (table.data().any()) {
            $(this).parent().show();
        } else {
            $(this).parent().hide();
        }
    });
  7. 0
    $(document).ready(function () {
        $('#datatable1').dataTable({
            fnDrawCallback: function () {
                if ($(this).find('.dataTables_empty').length == 1) {
                    $('th').hide();
                    $('#datatable1_info').hide();
                    $('#datatable1_paginate').hide();
                    $('.dataTables_empty').css({ "border-top": "1px solid #111" });
    
                } else {
                    $('th').show();
                    $('#datatable1_info').show();
                    $('#datatable1_paginate').show();
                }
            }, "oLanguage": { "sZeroRecords": "<p style='margin:0px !important'><a href='#' class='btn btn-success'>Add new</a></p>" }
        });
    });
    • tabla de datos en si la condición se aplica 1.) ¿cómo puede el encabezado y pie de tabla quitar con la condición 2.) «no match registro encontrado» cambiar el botón agregar nuevo esta tabla

Dejar respuesta

Please enter your comment!
Please enter your name here