Wie erstellen Sie die Tabelle mithilfe von json-Daten

Mein json-Teil:

var Json = {
 "Sample" : {
   "Sample Demo": {
     "1": {"JAN": {"ID": "1","Name": "Jim"}},
     "2": {"FEB": {"ID": "2","Name": "Jack" } }
    }},
 "Idname" : "2",
  "Date" : "01/28/2014",
  "State" : "1"
 }

Möchte ich das erstellen der Tabelle von oben json. Meine Tabelle-Header JAN,FEB und Daten werden ID und Name.

So erstellen Sie die Tabelle zur "Laufzeit" von einem ajax-request? So oder so geht es um verschachtelte document.createElement('[HTML_ELEMENT]');s wo [HTML_ELEMENT] sollte ersetzt werden durch <table><tr><td> während Sie sich durch das json-Objekt.
Ja,ein Teil von json ersetzt werden durch <table><tr><td> Hier mein jsfiddle aber bin nicht immer Ergebnis jsfiddle.net/5n2j7
nur zu deiner information, DataTables hat dieses out of the box
balexandre ich bin auf der Suche um dieses Problem zu lösen mit LENKER Helfer oder benutzerdefinierte js/jquery..

InformationsquelleAutor user3340300 | 2014-03-03

  1. 1

    Verwendung von jQuery:

    var content = "<table>";
jQuery.each(Json.Sample["Sample Demo"], function(i, val) {
  jQuery.each(val, function(j, v) { content += "<tr><td>"+v.ID+","+v.Name +"</tr></td>";});
});
content += "</table>"
    Können Sie diese als funktionsfähige demo basiert auf meiner Geige jsfiddle.net/5n2j7
    Ich aktualisiert Ihre jsfiddle mit dem code oben, erzeugt nun die gewünschte HTML-Tabelle.
    Seine nicht korrekt aktualisiert, ich denke so..Können Sie bitte separate Geige..
    jsfiddle.net/jPk26/1
    Ich brauche die Tabellenüberschriften JAN und FEB auch aus json

    InformationsquelleAutor Omer

  2. 0

    Haben Sie einen Blick auf diese Antwort.

    Der Autor beschreibt die folgende Lösung:

    Definieren Sie eine Vorlage in Ihrem HTML:

    <script type="text/template" id="cardTemplate">
<div>
    <a href="{0}">{1}</a>
</div>
</script>

    String verwenden.format zu ersetzen Variablen:

    var cardTemplate = $("#cardTemplate").html();
var template = cardTemplate.format("http://example.com", "Link Title");
$("#container").append(template); 

String.prototype.format = function() {
  var args = arguments;
  return this.replace(/{(\d+)}/g, function(match, number) { 
    return typeof args[number] != 'undefined'
      ? args[number]
      : match
    ;
  });
};
    Können Sie diese als funktionsfähige demo basiert auf meiner Geige jsfiddle.net/5n2j7
    Probieren Sie es selbst, wenn Sie in Probleme geraten, dann lassen Sie die community wissen, und dann können wir Hilfe von dort.

    InformationsquelleAutor shenku

Schreibe einen Kommentar