1

次のような結果を返すJSONリクエストがあります。

[
{"ID":"57","BookName":"Title1","AuthorID":"2" "AuthorName":"Paul"}
{"ID":"57","BookName":"Title1","AuthorID":"3" "AuthorName":"Mark"},
{"ID":"58","BookName":"Title2","AuthorID":"4" "AuthorName":"Bob"},
{"ID":"58","BookName":"Title2","AuthorID":"5" "AuthorName":"John"},
{"ID":"58","BookName":"Title2","AuthorID":"6" "AuthorName":"Chris"}
]

私が達成したいのは、次のHTML出力です。一意のIDごとdivに、一意の作成者を持つ新しいものが作成されます。新しいIDが識別されると、新しいテーブル行が作成され、その中に新しい作成者名が新しいdivとして追加されます。

HTML：

<tr>
    <td>ID: 57</td>
    <td>BookName: Title1</td>
</tr>
<tr>
    <td colspan="2">
        <div class="author">
            AuthorID : 2 Author Name: Paul
        </div>
        <div class="author">
            AuthorID : 3 Author Name: Mark
        </div>
    </td>
</tr>
<tr>
    <td>ID: 58</td>
    <td>BookName: Title2</td>
</tr>
<tr>
    <td colspan="2">
        <div class="author">
            AuthorID : 4 Author Name: Bob
        </div>
        <div class="author">
            AuthorID : 5 Author Name: John
        </div>
        <div class="author">
            AuthorID : 6 Author Name: Chris
        </div>
    </td>
</tr>

疑似ロジックを含むjQueryコードは次のとおりです。

$.getJSON(fullurl, function(json) {
    var bookid = '';
    $.each(json, function(i,d) {
        if(d.ID!= bookid){
            make new book row
            bookid= d.ID
         }
        else 
            use same row to show author div
         }
     }//end foreach

誰かが私がこれを行う方法を理解するのを手伝ってもらえますか？

4

1 に答える 1

2

使用できる構造でJSON出力を使用できない場合は、そのように操作する必要があります。著者を本でグループ化したい。

var books = {};
$.each(json, function () {
    if (!books.hasOwnProperty(this.ID)) {
        books[this.ID] = {
            "ID": this.ID,
            "BookName": this.BookName,
            "authors": []
        };
    }
    books[this.ID].authors.push({"AuthorID": this.AuthorID, "AuthorName":
        this.AuthorName});
});

books上で説明したように、目的の構造を持つをループして、テーブルの行を追加するのは比較的簡単です。

http://jsfiddle.net/rAYFZ/

于 2013-03-27T14:43:00.947 に答える