Get Elemente in einer jQuery DataTable

Question

Ich möchte auf Elemente zugreifen, die dynamisch in einer jQuery DataTable erstellt werden. Betrachten Sie den Code unten:

$(document).ready(function() { 
    var tableref = $('#myTable').DataTable({ "pageLength": 10 }); 
    for (var k=0; k<15; k++) { 
    tableref.row.add(['<div id="myDiv' + k + '">'+k+'</div>']).draw(); 
    console.log(document.getElementById('myDiv'+k)); 
    } 

}); 

Da die Seitengröße auf 10 festgelegt ist, kann ich nur Zugriff auf die ersten 10 divs. Sie können sehen, dass die Ausgabe der Konsole für die nächsten 5 Elemente null ist.

fiddle demo

Warum geschehen ist das? und wie kann ich dieses Problem lösen?

Answer 1

Wenn Sie alle Elemente der Tabelle erhalten Sie rows().nodes() verwenden können, gibt eine Liste der tr-Elemente, die erzeugt wurden.

Lese für weitere Informationen http://datatables.net/forums/discussion/7454/fngetnodes-only-returning-visible-nodes

in Ihrem Beispiel ....

$(document).ready(function() { 
    var tableref = $('#myTable').DataTable({ "pageLength": 10 }); 
    for (var k=0; k<15; k++) { 
     tableref.row.add(['<div id="myDiv' + k + '">'+k+'</div>']).draw(); 
     //console.log(document.getElementById('myDiv'+k));//Return 10 divs 
    } 

    var aTR = tableref.rows().nodes(); 

    for (var i = 0; i < aTR.length; i++) { 

     console.log($(aTR[i]).find('div')); //return 20 divs 

    } 

}); 

Ergebnis: https://jsfiddle.net/cmedina/7kfmyw6x/22/

Answer 2

Wenn Sie auf die Daten eines Datenobjekts zugreifen möchten, sollten Sie nicht über die Zeilen, sondern über die Dateneigenschaft iterieren.

Als Referenz Besuche diese Seite: https://datatables.net/reference/api/data()