delaydata.htm 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title></title>
  5. <link href="../../../lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
  6. <script src="../../../lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
  7. <script src="../../../lib/ligerUI/js/core/base.js" type="text/javascript"></script>
  8. <script src="../../../lib/ligerUI/js/plugins/ligerGrid.js" type="text/javascript"></script>
  9. <script src="../../../lib/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
  10. <script type="text/javascript">
  11. var $grid;
  12. $(function ()
  13. {
  14. //v1.02以上支持直接返回grid的管理对象
  15. $grid = $("#maingrid").ligerGrid({
  16. columns: [
  17. { display: '主键', name: 'id', width: 50, type: 'int' },
  18. { display: '名字', name: 'name', width: 50 },
  19. { display: '性别', name: 'sex', width: 50 }
  20. ], width: '100%', pkName: 'id', pageSizeOptions: [5, 10, 15, 20], height: '100%'
  21. }
  22. );
  23. //延时加载数据
  24. //grid.setOptions({ data: jsonObj }); //设置数据参数
  25. // grid.loadData();//加载数据
  26. });
  27. function show()
  28. {
  29. var jsonObj = {};
  30. jsonObj.Rows = [
  31. { id: 3, name: "林三", sex: "男", birthday: "1989-01-12" },
  32. { id: 43, name: "陈丽", sex: "女", birthday: "1989-01-12" },
  33. { id: 33, name: "啊三", sex: "男", birthday: "1981-12-12" },
  34. { id: 34, name: "表三", sex: "男", birthday: "1983-01-12" },
  35. { id: 43, name: "陈丽", sex: "女", birthday: "1989-01-12" },
  36. { id: 33, name: "成三", sex: "男", birthday: "1989-11-23" },
  37. { id: 34, name: "都三", sex: "女", birthday: "1989-04-12" },
  38. { id: 324, name: "鄂三", sex: "男", birthday: "1999-05-15" },
  39. { id: 344, name: "林三", sex: "男", birthday: "1969-02-21" },
  40. { id: 1, name: "王开", sex: "男", birthday: "1989-01-12" }
  41. ];
  42. $grid.set({ data: jsonObj });
  43. }
  44. </script>
  45. </head>
  46. <body style="padding:10px">
  47. <input type="button" id="btnShow" onclick="show()" value="show Data"/>
  48. <div id="maingrid"></div>
  49. </body>
  50. </html>