EasyUI datagrid 一个可以 直接运行例子一个文件 六

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8" />
 5     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 6     <title>Page Title</title>
 7     <meta name="viewport" content="width=device-width, initial-scale=1">
 8     <link rel="stylesheet" type="text/css" href="http://www.jeasyui.net/Public/js/easyui/themes/default/easyui.css">
 9     <link rel="stylesheet" type="text/css" href="http://www.jeasyui.net/Public/js/easyui/themes/icon.css">
10     <script type="text/javascript"  src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
11     <script type="text/javascript" src="http://www.jeasyui.net/Public/js/easyui/jquery.easyui.min.js"></script>
12 </head>
13 <body>
14 <table id="dg" class="easyui-datagrid" style="width: auto; height: 350px;"></table>
15 
16 </body>
17 <script>
18 
19     $("#dg").datagrid({
20         iconCls: "icon-add",
21         fitColumns: false,
22         loadMsg: "数据加载中......",
23         data:[ { "productid": "K9-DL-01", "unitcost": 12, "status": "P", "listprice": 18, "attr1": "Spotted Adult Female", "itemid": "EST-10" }, { "productid": "RP-SN-01", "unitcost": 12, "status": "P", "listprice": 18, "attr1": "Venomless", "itemid": "EST-11" }, { "productid": "RP-SN-01", "unitcost": 12, "status": "P", "listprice": 18, "attr1": "Rattleless", "itemid": "EST-12" }, { "productid": "RP-LI-02", "unitcost": 12, "status": "P", "listprice": 18, "attr1": "Green Adult", "itemid": "EST-13" }, { "productid": "FL-DSH-01", "unitcost": 12, "status": "P", "listprice": 58, "attr1": "Tailless", "itemid": "EST-14" }, { "productid": "FL-DSH-01", "unitcost": 12, "status": "P", "listprice": 23, "attr1": "With tail", "itemid": "EST-15" }, { "productid": "FL-DLH-02", "unitcost": 12, "status": "P", "listprice": 93, "attr1": "Adult Female", "itemid": "EST-16" }, { "productid": "FL-DLH-02", "unitcost": 12, "status": "P", "listprice": 93, "attr1": "Adult Male", "itemid": "EST-17" }, { "productid": "AV-CB-01", "unitcost": 92, "status": "P", "listprice": 193, "attr1": "Adult Male", "itemid": "EST-18" }, { "productid": "AV-CB-03", "unitcost": 92, "status": "P", "listprice": 193, "attr1": "Adult Male", "itemid": "EST-134" }] ,
24         pagination: true,
25         rownumbers: true,
26         nowrap: false,
27         showFooter: true,
28         singleSelect: true,
29 
30         columns: [[
31             {
32                 field: 'itemid', title: '编号', width: 50, align: 'center',
33                 formatter: function (value, row, index) {
34                     return " <a href='javascript:void(0)' onclick='return LoadUserInfo()'>" + value + "</a>";
35                 }
36             },
37             {
38                 field: 'productid', title: '用户名', width: 150, align: 'center',
39             },
40             {
41                 field: 'listprice', title: '姓名', width: 150, align: 'center',
42             },
43             {
44                 field: 'unitcost', title: '操作', width: 100, align: 'center',
45             },
46             {
47                 field: 'attr1', title: '操作', width: 100, align: 'center',
48             },
49             {
50                 field: 'status', title: '操作', width: 100, align: 'center',
51             }
52         ]]
53     })
54 </script>
55 </html>

猜你喜欢

转载自www.cnblogs.com/LiuFengH/p/10161356.html