EasyUI datagrid 一個可以 直接執行例子一個檔案 六
阿新 • • 發佈：2018-12-22
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>