LAYUI綁定數據表,接口測試成功不顯示數據問題

編寫如下代碼:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="../layui/css/layui.css" media="all" />
    <script src="../layui/layui.js" type="text/javascript"></script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <table class="layui-table" lay-data="{url:'../From_JSON/AfterAssembly.json'}" lay-filter="myTable">
            <thead>
                <tr>
                    <th lay-data="{checkbox:true}"></th>
                    <th lay-data="{field:'Name',title:'姓名',align:'center'}"></th>
                    <th lay-data="{field:'Section',title:'性別',align:'center'}"></th>
                    <th lay-data="{field:'content',title:'年齡',align:'center'}"></th>
                </tr>
            </thead>
        </table>
        <button id="btnSave" class="layui-btn" type="button" runat="server">提交</button>
    </form>
</body>
</html>

接口數據:

{
  "code": 0,
  "msg": "",
  "count": 3,
  "data": [
    {
      "Name": "名稱1",
      "Section": "11",
      "content": "內容1"
    },
    {
      "Name": "名稱2",
      "Section": "22",
      "content": "內容2"
    },
    {
      "Name": "名稱3",
      "Section": "33",
      "content": "內容3"
    }
  ]
}

測試窗口:

竟然不顯示數據。


更改後代碼:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="../layui/css/layui.css" media="all" />
    <script src="../layui/layui.js" type="text/javascript"></script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <table class="layui-table" lay-data="{url:'../From_JSON/AfterAssembly.json'}" lay-filter="myTable">
            <thead>
                <tr>
                    <th lay-data="{checkbox:true}"></th>
                    <th lay-data="{field:'Name',title:'姓名',align:'center'}"></th>
                    <th lay-data="{field:'Section',title:'性別',align:'center'}"></th>
                    <th lay-data="{field:'content',title:'年齡',align:'center'}"></th>
                </tr>
            </thead>
        </table>
        <button id="btnSave" class="layui-btn" type="button" runat="server">提交</button>
    </form>
    <script>
        layui.use('table', function () {
            var table = layui.table;
        });
    </script>
</body>
</html>

測試窗口:

成功了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章