0

私はJSとクライアント側に非常に慣れていません。これを達成するのを手伝ってください：

サブジェクトをデータベースに追加するたびに、それをテーブルに表示したいと考えています。

html

    {% block main-menu %}
        <h3>Existing Subjects</h3>
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Documents</th>
                    <th>Followers</th>
                    <th>Created</th>
                    <th>Updated</th>
                    <th>Posted By</th>
                </tr>
            <tbody>
            {% if subjects %}
                    <tr id="subject-description-main-menu-list">
                        <th id="subject-name"></th>
                        <th id="subject-docs"></th>
                        <th id="subject-followers"></th>
                        <th id="subject-created"></th>
                        <th id="subject-updated"></th>
                        <th id="subject-posted-by"></th>
                    </tr>
            {% endif %}
            </tbody>
        </table>
    {% endblock %}

そして、これは私のJqueryです：

function fill_subject_table_in_main_content() {
    $("#subject-description-main-menu-list").text('');
    $.get("/subject/list/", function(data){
        var FIELDS = ['name', 'num_of_followers', 'created_time', "created_by"];
        for( var i=0; i<data.length; i++) {
            for ( var j=0; j<FIELDS.length; j++) {
                $("#subject-description-main-menu-list").append('<th>'+data[i]['fields'][FIELDS[j]]+'</th>');
            }
        };
    }, 'json');
}

get メソッドで取得しているデータは正しいのですが、1 行に表示されます.....しかし、テーブルとして表示したいのです...

今は次のようになります。

Existing Subjects
Name    Documents   Followers   Created                           Updated   Posted By
Math 140       NONE             1         2012-08-17 08:04:02      NONE       r English 102 1   2012-08-17 08:04:14 r
4

1 に答える 1

1

まず、ヘッダー タグをテーブルに追加します。代わりに「td」が必要です。次に、行である $("#subject-description-main-menu-list") で .append を呼び出しています。テーブルに行を追加し、各行にデータを追加する必要があります。

何かのようなもの：

for( var i=0; i<data.length; i++) {
var newRow = document.createElement("tr");
for ( var j=0; j<FIELDS.length; j++) {
    $(newRow).append('<td>'+data[i]['fields'][FIELDS[j]]+'</td>');
}
$("#yourTableId").append(newRow);

};

于 2012-08-17T13:24:28.080 に答える