Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
642 views
in Technique[技术] by (71.8m points)

jquery - Filling a Big Table Rows from JSON Data

I am trying to fill up a table using JSON data

Here's what I am thinking

$.ajax({
  dataType: "json",
  url: "music.json"
})
.done(function(gamesjson){
    DATA = gamesjson;
    buildTable(DATA ); // this one is calling the above code
  })
.fail(function(){
    console.log("music.json error");
  })
;

function buildTable(DATA){
var gl = $("#gl");
$.each(DATA.music, function(index, value) {
// code to populate table
??

}

$("#gl").append(gl);
}

What do I write in buildTable()? Also if my json contains 1000 rows, what's the best way to build table?

Please give an example and explanation. Thanks

http://jsfiddle.net/9u4zR/1/

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Something like this:

function buildTable(DATA){
    var table = "<table>";
    $.each(DATA.music, function(index, value) {
        table += "<tr><td>" + value.col1 + "</td><td>" + value.col2 + "</td></tr>";
    }
    table += "</table>";
    $("#gl").append(table);    
}

Of course, you need to replace col1 and col2 with the names of your actual properties, and add more columns as needed. You'll also probably want to specify classes or styles. But this shows you the general structure, you can refine it as needed for your application.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...