Generieren einer dynamischen Tabelle in Javascript mit JSON

Question

Ich möchte eine Javascript-Tabelle erstellen, die mit JSON erstellt wird. Dieser JSON wird vom Backend gesendet (mit Django), so dass er jederzeit geändert werden kann. Der Name der Spalte wäre die Kategorie. Meine JSON Form wie folgt aussieht:

var data = [ 
{ 
    "title": "Leadership", 
    "category": "humaninteraction" 
}, 
{ 
    "title": "Maintenance procedures", 
    "category": "procedures" 
}, 
{ 
    "title": "Situational Awareness", 
    "category": "environmentsituations" 
}, 
{ 
    "title": "Self-Criticism", 
    "category": "self" 
}, 
{ 
    "title": "Tools", 
    "category": "aircraft" 
}]; 

Answer 1

Sie $.getJSON() verwenden können, die JSON aus dem Backend zu erhalten und verwenden $.each() jede Zeile zu bauen. Wie folgt aus:

function generateTable(){  
    var rows = ''; 
    $.getJSON("backend/method", function(data) { 
     $.each(data, function(key, val) { 
     rows += '<tr>'; 
     rows += '<td>' + data.title + '</td>'; 
     rows += '<td>' + data.category+ '</td>'; 
     rows += '</tr>'; 
     }); 
    }); 
    $('#tableId').append(rows); 
}