Ich verwende append(), um der Tabelle neue Zeilen hinzuzufügen, aber das Problem ist, dass ich die alten Zeilen entfernen muss, bevor ich neue hinzufüge.

success: function(response) {
    response.AnArray.forEach( function (arrayItem){
        $('.tableName > tbody').append('<tr>...</tr>');
    });
}

Dann habe ich über append() zu html() gewechselt, jetzt wird nur noch eine Zeile zur Tabelle hinzugefügt.

Hinweis:

$ ('. tableName> tbody'). empty ();

Funktioniert in meinem Fall nicht.

Was vermisse ich?

0
Dip 18 Apr. 2018 im 14:26

4 Antworten

Beste Antwort

Meine Lösung ähnelt @Shree, aber verwenden Sie dort html(), anstatt anzuhängen.

success: function(response) {
    $('.createPOVTable > tbody').empty();
    var htmlData = '';
    response.AnArray.forEach( function (arrayItem){
      htmlData += '<tr>...</tr>';
    });
    $('.createPOVTable > tbody').html(htmlData)
} 
1
Gammer 18 Apr. 2018 im 11:43

Wenn Sie alle vorherigen Zeilen entfernen möchten, können Sie Folgendes tun

$("#tbodyID").empty();

Dadurch wird der Tabellenkörper gelöscht und dann verwendet

$("#tbodyID").append('<tr>...</tr>');

Ihr endgültiger Code sollte also so aussehen

success: function(response) {
   $("#tbodyID").empty();
response.AnArray.forEach( function (arrayItem){
    $("#tbodyID").append('<tr>...</tr>');
});
}
1
George Bailey 18 Apr. 2018 im 11:30

.html () ersetzt den Inhalt des Körpers bei jeder Iteration vollständig, sodass immer nur die zuletzt eingefügte Zeile angezeigt wird. Leeren Sie stattdessen den tbody, bevor Sie mit der Iteration beginnen, und fügen Sie dann mit append die neue Zeile wie folgt hinzu:

success: function(response) {
    $('.createPOVTable > tbody').empty();
    response.AnArray.forEach( function (arrayItem){
        $('.createPOVTable > tbody').append('<tr>...</tr>');
    });
}
4
beliha 18 Apr. 2018 im 11:30

Verwenden Sie append nicht in jeder Schleife. Generieren Sie also zuerst eine Markierung als Zeichenfolge und hängen Sie diese außerhalb der Schleife wie folgt an.

success: function(response) {
    $('.createPOVTable > tbody').empty();
    var html = '';
    response.AnArray.forEach( function (arrayItem){
      html += '<tr>...</tr>';
    });
    $('.createPOVTable > tbody').append(html)
}
0
Shree 18 Apr. 2018 im 11:36