jquery datatable – larghezza dell’intestazione della tabella non allineata con la larghezza del corpo

CAUSA

Molto probabilmente la tabella inizialmente è nascosta, il che impedisce a jQuery DataTables di calcolare la larghezza delle colonne.

SOLUZIONE

  • Se la tabella si trova nell’elemento comprimibile, è necessario regolare le intestazioni quando diventa visibile l’elemento comprimibile.

    Ad esempio, per il plug-in Bootstrap Collapse:

    $('#myCollapsible').on('shown.bs.collapse', function () {
       $($.fn.dataTable.tables(true)).DataTable()
          .columns.adjust();
    });
  • Se la tabella è nella scheda, è necessario regolare le intestazioni quando la scheda diventa visibile.

    Ad esempio, per il plug-in Bootstrap Tab:

    $('a[data-toggle="tab"]').on('shown.bs.tab', function(e){
       $($.fn.dataTable.tables(true)).DataTable()
          .columns.adjust();
    });

Il codice sopra regola la larghezza delle colonne per tutte le tabelle della pagina. Vedi i columns().adjust()metodi API per ulteriori informazioni.