2015-04-04 6 views
7

Vorrei cambiare il titolo di una colonna mia datatable generato dal plugin jQuery DatatableCome modificare dinamicamente il titolo della colonna del plugin jQuery dataTable?

Sapete se posso fare qualcosa di simile:

table = $('#example').DataTable({ 
     "data": source_dataTable, 
     "columnDefs": defs, 

    "dom": 't<"top"f>rt<"bottom"lpi><"clear">', 
}); 
// WHAT I WANT TO DO: 
    table.column(0).title.text("new title for the column 0") 

?

rende un html una prima linea del genere:

<table id="example" class="row-border hover dataTable no-footer" role="grid" aria-describedby="example_info" style="width: 1140px;"> 
    <thead> 
     <tr role="row"> 
       <th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="S&amp;#233;lectionn&amp;#233;: activer pour trier la colonne par ordre croissant" style="width: 94px;">Sélectionné</th> 

       <th class="sorting" tabindex="0" aria-controls="example" rowspan="1" colspan="1" aria-label="Anglais : activer pour 

        trier la colonne par ordre croissant" style="width: 

62px;">Anglais </th> 

</tr> 
</thead> 
</table> 

...

In una tabella normale il codice di lavoro muggito, ma per DataTable reso dal plugin jQuery, non è così:

$('#example tr:eq(0) th:eq(0)').text("Text update by code"); 

Forse c'è un metodo API o in un altro modo dom?

+0

esempi dovrebbero essere in inglese, n ot in francese –

risposta

5

ho trovato una soluzione che in realtà lo fanno in modo dinamico

$(table.column(1).header()).text('My title'); 
4

utilizzare sotto il codice. controllare DEMO

se prima tr con td

$('table tr:eq(0) td:eq(0)').text("Text update by code"); 

se prima tr con th

$('table tr:eq(0) th:eq(0)').text("Text update by code"); 

quando si utilizza processo lato servizio o vogliono fare qualche azione volta carico tabella dei dati di tutti i dati utilizzano Draw event.

Draw event - licenziato una volta che il tavolo ha completato un pareggio

Esempio

$('#example').dataTable(); 

$('#example').on('draw.dt', function() { 
    console.log('Redraw occurred at: '+new Date().getTime()); 
    $('#example tr:eq(0) th:eq(0)').text("Text update by code"); 
}); 

Uso della prenotazione.
drawCallback Funzione che viene chiamata ogni volta che DataTables esegue un'estrazione. controllare DEMO

$('#example').dataTable({ 
    "drawCallback": function(settings) { 
     $('#example tr:eq(0) th:eq(0)').text("Text update by code"); 
    } 
    }); 

attivare tutte le opzioni di richiamata HERE

+0

Grazie, sono sicuro che dovrebbe funzionare con la tabella classica ma non con la tabella generata con jQuery datatable –

+0

funzionerà anche con la tabella di dati. aggiungi il codice usando l'id della tabella che usi per datatable .. puoi mostrare il mio codice? –

+0

Ho modificato la domanda, ho cercato $ ('tabella # esempio tr: eq (0) th: eq (0)'). Text ("Aggiornamento del testo per codice"); ma non lavorare –

1

possibile da questo modo:

"columns": [{ sTitle: "Column1"},{ sTitle: "Column2"}] 
+0

Questo funziona per impostare perfettamente il nome della colonna – Ulterior

Problemi correlati