easyUI(一) -- 加载本地JSON数据

来源：互联网发布：重装系统保留软件编辑：程序博客网时间：2024/06/05 05:51

easyui官网上的Demo是加载JSON的方法是错误的 , 直接复制粘贴数据显示不出来 , 但是可以通过以下方法解决 .
1.将本地JSON数据写在 script 标签内 ,使用 $(“tt”).datagrid(“loadData”,json)可以直接把JSON数据写在表格中 .

<table id="tt" title="Load Data" class="easyui-datagrid" style="width:550px;height:250px"            iconCls="icon-save" pagination="true"  rownumbers="true"  multiple="false">        <thead>            <tr>                <th field="ck" checkbox="true"></th>                <th field="itemid" width="80">Item ID</th>                <th field="productid" width="80">Product ID</th>                <th field="listprice" width="80" align="right">List Price</th>                <th field="unitcost" width="80" align="right">Unit Cost</th>                <th field="attr1" width="100">Attribute</th>                <th field="status" width="60" align="center">Stauts</th>            </tr>        </thead>            </table>

script中的代码 , 注意这段代码要加在 $(function(){}) 中

 $('#tt').datagrid('loadData', {"total":28,"rows":[    {"productid":"FI-SW-01","":10.00,"status":"P","listprice":16.50,"attr1":"Large","itemid":"EST-1"},    {"productid":"K9-DL-01","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Spotted Adult Female","itemid":"EST-10"},    {"productid":"RP-SN-01","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Venomless","itemid":"EST-11"},    {"productid":"RP-SN-01","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Rattleless","itemid":"EST-12"},    {"productid":"RP-LI-02","unitcost":12.00,"status":"P","listprice":18.50,"attr1":"Green Adult","itemid":"EST-13"},    {"productid":"FL-DSH-01","unitcost":12.00,"status":"P","listprice":58.50,"attr1":"Tailless","itemid":"EST-14"},    {"productid":"FL-DSH-01","unitcost":12.00,"status":"P","listprice":23.50,"attr1":"With tail","itemid":"EST-15"},    {"productid":"FL-DLH-02","unitcost":12.00,"status":"P","listprice":93.50,"attr1":"Adult Female","itemid":"EST-16"},    {"productid":"FL-DLH-02","unitcost":12.00,"status":"P","listprice":93.50,"attr1":"Adult Male","itemid":"EST-17"},    {"productid":"AV-CB-01","unitcost":92.00,"status":"P","listprice":193.50,"attr1":"Adult Male","itemid":"EST-18"}]}

通过 url 指定 JSON 的位置 .
在table标签中写 data-options=”url:’data/datagrid_data.json’”

需要注意的是 , 如果你在 script 中加载 JSON 数据 , 那么你用 data-options 是取不到数据的 . 同样的如果你的JSON数据在某个文件夹中 , 那么你在 table 中定义 url=”地址..” 也是无效的 . 具体原因不明 .

1 0