Home Explore Help
Register Sign In
PerfectEquation
/
GZ
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: db155e2997
Branches Tags
GZ
/
nwyj
/
.svn
/
pristine
/
c2
/
c26044e8bf6d06927ab2eb3678ecd6225de72b3f.svn-base

c26044e8bf6d06927ab2eb3678ecd6225de72b3f.svn-base 11 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. 

  2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. 

  3. <head>
    4. 

  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5. 

  5. <!--框架必需start-->
    6. 

  6. <script type="text/javascript" src="../../libs/js/jquery.js"></script>
    7. 

  7. <script type="text/javascript" src="../../libs/js/language/cn.js"></script>
    8. 

  8. <script type="text/javascript" src="../../libs/js/framework.js"></script>
    9. 

  9. <link href="../../libs/css/import_basic.css" rel="stylesheet" type="text/css"/>
    10. 

  10. <link rel="stylesheet" type="text/css" id="skin" prePath="../../"/>
    11. 

  11. <link rel="stylesheet" type="text/css" id="customSkin"/>
    12. 

  12. <!--框架必需end-->
    13. 

  13. 

  14. <!--数据表格start-->
    15. 

  15. <script src="../../libs/js/table/quiGrid.js" type="text/javascript"></script>
    16. 

  16. <!--数据表格end-->
    17. 

  17. 

  18. </head>
    19. 

  19. <body>
    20. 

  20. 	<input type="button" value="渲染成另一个表格" onclick="changeGrid()" />  
    21. 

  21. 	适用于切换成列不一样的表格，如果列相同只是数据不同只要重新设置数据路径然后loadData()即可。
    22. 

  22. 	<div class="padding_right5">
    23. 

  23. 		<div id="maingrid"></div>
    24. 

  24.     </div>
    25. 

  25. 	<script type="text/javascript">
    26. 

  26.         var testData={"form.paginate.pageNo":1,"form.paginate.totalRows":13,"rows":[
    27. 

  27.       {"deptName":"部门1","sex":"女","remark":"好啊","hobby":["唱歌"],"beginworkDate":"2012-06-13","photo":null,"version":null,"id":125,"degree":"硕士结业","age":20,"name":"员工1","deptId":12,"ability":1},
    28. 

  28.       {"deptName":"部门1","sex":"男","remark":"备注啊","hobby":["唱歌"],"beginworkDate":"2012-06-13","photo":null,"version":null,"id":124,"degree":"本科毕业","age":20,"name":"员工2","deptId":11,"ability":2},
    29. 

  29.       {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":123,"degree":"本科毕业","age":20,"name":"员工3","deptId":9,"ability":2},
    30. 

  30.       {"deptName":"部门1","sex":"女","remark":"不错啊","hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":121,"degree":"硕士肄业","age":20,"name":"员工4","deptId":8,"ability":3},
    31. 

  31.       {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":120,"degree":"博士肄业","age":20,"name":"员工5","deptId":7,"ability":4},
    32. 

  32.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工6","deptId":6,"ability":5},
    33. 

  33.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工7","deptId":6,"ability":6},
    34. 

  34.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工8","deptId":6,"ability":5},
    35. 

  35.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工9","deptId":6,"ability":3},
    36. 

  36.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工10","deptId":6,"ability":1},
    37. 

  37.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工11","deptId":6,"ability":5},
    38. 

  38.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工12","deptId":6,"ability":5}
    39. 

  39.       ]}
    40. 

  40.       
    41. 

  41.        var testData2={"form.paginate.pageNo":1,"form.paginate.totalRows":13,"rows":[
    42. 

  42.       {"deptName":"部门1","sex":"女","remark":"好啊","hobby":["唱歌"],"beginworkDate":"2012-06-13","photo":null,"version":null,"id":125,"degree":"硕士结业","age":20,"name":"员工21","deptId":12,"ability":1},
    43. 

  43.       {"deptName":"部门1","sex":"男","remark":"备注啊","hobby":["唱歌"],"beginworkDate":"2012-06-13","photo":null,"version":null,"id":124,"degree":"本科毕业","age":20,"name":"员工21","deptId":11,"ability":2},
    44. 

  44.       {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":123,"degree":"本科毕业","age":20,"name":"员工23","deptId":9,"ability":2},
    45. 

  45.       {"deptName":"部门1","sex":"女","remark":"不错啊","hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":121,"degree":"硕士肄业","age":20,"name":"员工24","deptId":8,"ability":3},
    46. 

  46.       {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":120,"degree":"博士肄业","age":20,"name":"员工25","deptId":7,"ability":4},
    47. 

  47.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工26","deptId":6,"ability":5},
    48. 

  48.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工27","deptId":6,"ability":6},
    49. 

  49.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工28","deptId":6,"ability":5},
    50. 

  50.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工29","deptId":6,"ability":3},
    51. 

  51.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工30","deptId":6,"ability":1},
    52. 

  52.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工31","deptId":6,"ability":5},
    53. 

  53.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工32","deptId":6,"ability":5},
    54. 

  54.        {"deptName":"部门1","sex":"女","remark":"好啊","hobby":["唱歌"],"beginworkDate":"2012-06-13","photo":null,"version":null,"id":125,"degree":"硕士结业","age":20,"name":"员工21","deptId":12,"ability":1},
    55. 

  55.       {"deptName":"部门1","sex":"男","remark":"备注啊","hobby":["唱歌"],"beginworkDate":"2012-06-13","photo":null,"version":null,"id":124,"degree":"本科毕业","age":20,"name":"员工21","deptId":11,"ability":2},
    56. 

  56.       {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":123,"degree":"本科毕业","age":20,"name":"员工23","deptId":9,"ability":2},
    57. 

  57.       {"deptName":"部门1","sex":"女","remark":"不错啊","hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":121,"degree":"硕士肄业","age":20,"name":"员工24","deptId":8,"ability":3},
    58. 

  58.       {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12","photo":null,"version":null,"id":120,"degree":"博士肄业","age":20,"name":"员工25","deptId":7,"ability":4},
    59. 

  59.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工26","deptId":6,"ability":5},
    60. 

  60.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工27","deptId":6,"ability":6},
    61. 

  61.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工28","deptId":6,"ability":5},
    62. 

  62.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工29","deptId":6,"ability":3},
    63. 

  63.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工30","deptId":6,"ability":1},
    64. 

  64.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工31","deptId":6,"ability":5},
    65. 

  65.       {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工32","deptId":6,"ability":5}
    66. 

  66.       ]}
    67. 

  67.        
    68. 

  68.        //数据表格使用
    69. 

  69.         var g;
    70. 

  70. 		function initComplete(){
    71. 

  71. 			 g = $("#maingrid").quiGrid({
    72. 

  72.                 columns: [ 
    73. 

  73. 	                { display: '姓名', name: 'name', align: 'center',  width: "30%"},
    74. 

  74. 	                { display: '性别', name: 'sex', align: 'center' , width: "20%"},
    75. 

  75. 	                { display: '部门', name: 'deptName',  align: 'center' , width: "30%"},
    76. 

  76. 	                { display: '学历', name: 'degree',  align: 'center', width: "20%" }
    77. 

  77.                 ], data:testData, pageSize: 10, rownumbers:true, checkbox:true,percentWidthMode:true,
    78. 

  78.                 height: '100%', width:"100%"
    79. 

  79.             });
    80. 

  80. 		}
    81. 

  81.         function changeGrid(){
    82. 

  82.         	var columns = [
    83. 

  83.                { display: '姓名', name: 'name', align: 'center',  width: "10%"},
    84. 

  84. 	                { display: '工作日期', name: 'beginworkDate', align: 'center' , width: "20%"},
    85. 

  85. 	                { display: '年龄', name: 'age',  align: 'center' , width: "10%"},
    86. 

  86. 	                { display: '爱好', name: 'hobby',  align: 'center', width: "20%" }, 
    87. 

  87. 	                { display: '性别', name: 'sex', align: 'center' , width: "10%"},
    88. 

  88. 	                { display: '部门', name: 'deptName',  align: 'center' , width: "20%"},
    89. 

  89. 	                { display: '学历', name: 'degree',  align: 'center', width: "10%" }];
    90. 

  90. 	        g.options.data=testData2;   
    91. 

  91.             g.set('columns', columns); 
    92. 

  92.             g.loadData(); 
    93. 

  93.         }
    94. 

  94.     </script>	
    95. 

  95. </body>
    96. 

  96. </html>
    97.