如何使用jquery为HTML

时间:2017-12-04 13:56:35

标签: jquery html json html-table

我通过从JSON解析来自变量中的数据库。现在我想创建一个HTML表结构,如下所示

<table class="table dataList fiberEngg">
    <tbody>
        <tr>
            <td>
                <div class="row noPadding">
                    <div class="col-xs-6 colPadding">
                        MHBHNDMUNVMBSPN006_BU
                        <a class="button"><i class="fa fa-map-marker" aria-hidden="true"></i></a><a class="button"><i class="fa fa-list" aria-hidden="true"></i></a>
                    </div>
                    <div class="col-xs-6 colPadding">
                        <p><strong>Request Id :</strong>053214</p>
                        <p><strong>Last Updated by :</strong>Sameer Parab</p>
                        <p><strong>Status :</strong>Partial HOTO with Partial LIT</p>
                        <p><strong>Pending Since :</strong>1 Day</p>
                    </div>
                </div>
            </td>
        </tr>
    </tbody>
</table>

我的JSON在

之下
[
    {
        "SPAN_ID": "GJVAPIMHKAKHSPN003_BU",
        "MAINTENANCEZONECODE": "INMUMIBH01",
        "REQ_ID": 4.0,
        "LAST_UPDATE_BY": "HARDIK1.SHAH",
        "STATUS_NAME": "HOTO without LIT",
        "PENDING_DAYS": 7.0
    }
]

如何在下面的代码中创建表结构

 success: function (response) {

    var datalist = JSON.parse(response);
    var table = $("#tblFiberEngData");
    table.empty();

    datalist.forEach(function (dataRow) {
        //here i want to create structure
    });
}

2 个答案:

答案 0 :(得分:1)

在你的成功范围内做这样的事情。

从my_table开始及以下。

3306

根据您的代码jsfiddle:https://jsfiddle.net/synz/kez21quf/

答案 1 :(得分:0)

为了使用jQuery动态追加元素,试试这个:

&#13;
&#13;
$( "td" ).append( "<div></div>" );
&#13;
&#13;
&#13;