0

以下のコードは、API から受け取る JSON 応答です。残念ながら、この応答の送信方法を変更することはできません。この応答は、Javascript/jQuery の範囲内でのみ使用できます。

私の目標は、これを HTML テーブルに変換することです。

私はすでにこれを自分でやろうとしました。

function CreateTableView(objArray, theme, enableHeader) {
    // set optional theme parameter
    if (theme === undefined) {
        theme = 'mediumTable'; //default theme
    }

    if (enableHeader === undefined) {
        enableHeader = true; //default enable headers
    }

    // If the returned data is an object do nothing, else try to parse
    var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;

    var str = '<table id="res" class="' + theme + '">';

    // table head
    if (enableHeader) {
        str += '<thead><tr>';
        for (var index in array[0]) {
            str += '<th scope="col">' + index.toUpperCase() + '</th>';
        }
        str += '</tr></thead>';
    }

    // table body
    str += '<tbody>';
    for (var i = 0; i < array.length; i++) {
        str += (i % 2 == 0) ? '<tr class="alt" id="' + array[i]['id'] + '">' : '<tr id="' + array[i]['id'] + '">';
        for (var index in array[i]) {
            str += '<td style="width:15%;">' + htmlspecialchars_decode(array[i][index]) + '</td>';
        }
        str += '<td><a href="#" onClick="editPerson(' + array[i]['id'] + ');">Edit</a></td><td><a href="#" onClick="delPerson(' + array[i]['id'] + ');">Delete</a></td></tr>';
    }
    str += '</tbody>'
    str += '</table>';
    return str;
}

ただし、ヘッダーを表示することしかできません...しかし、JSON応答に配列が1つしかない場合、つまり1行が返される場合はうまく機能します。

上記のコードは、Stackoverflow でのこのような他のいくつかの質問から適応されました。私はこれに何日も費やしましたが、これらの結果を表に表示することはできません...これは、この例と同じように返される他の多くの例の 1 つにすぎません。このソリューションを何度も再利用する必要があるため、私にとって非常に重要です。

"ItemArray":{
        "id":"14"
        ,"0":
            {"id":"1","username":"guest","fname":"Guest","lname":"User","email":"example@domain.com","group":"member","active":"0","url":null,"last_activity":null}
        ,"1":
            {"id":"2","username":"system","fname":"Internal","lname":"System","email":"example@domain.com","group":"member","active":"0","url":null,"last_activity":null}
        ,"2":
            {"id":"3","username":"master","fname":"Super","lname":"Admin","email":"example@domain.com","group":"member","active":"0","url":null,"last_activity":null}
        ,"3":
            {"id":"14","username":"apitest","fname":"API","lname":"Test","email":"user@domain.com","group":"member","active":"0","url":null,"last_activity":"2012-10-29 02:48:43"}
        }
4

2 に答える 2

1

オブジェクトには使用できないためarray.length、次のものが必要です。

for (var o in array) if (array.hasOwnProperty(o)) {
    var row = array[o];
}
于 2012-10-29T09:18:58.863 に答える
0

わかりました...問題は、アイテム配列がオブジェクトに解析されることです。配列ではありません。これをログに記録すると:

  typeof array.length

結果は未定義です。したがって、ループは実行されません。

于 2012-10-29T08:52:42.200 に答える