| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title></title>
- <!--框架必需start-->
- <script type="text/javascript" src="../../libs/js/jquery.js"></script>
- <script type="text/javascript" src="../../libs/js/language/cn.js"></script>
- <script type="text/javascript" src="../../libs/js/framework.js"></script>
- <link href="../../libs/css/import_basic.css" rel="stylesheet" type="text/css"/>
- <link rel="stylesheet" type="text/css" id="skin" prePath="../../"/>
- <link rel="stylesheet" type="text/css" id="customSkin"/>
- <!--框架必需end-->
- <!--数据表格start-->
- <script src="../../libs/js/table/quiGrid.js" type="text/javascript"></script>
- <!--数据表格end-->
- </head>
- <body>
- <div class="padding_right5">
- <div id="maingrid"></div>
- </div>
- <script type="text/javascript">
- var testData={"form.paginate.pageNo":1,"form.paginate.totalRows":13,"rows":[
- {"deptName":"部门1","sex":"女","remark":"好啊","hobby":["唱歌"],"beginworkDate":"2012-06-13 00:00:00.0","photo":null,"version":null,"id":125,"degree":"硕士结业","age":20,"name":"员工1","deptId":12,"ability":1},
- {"deptName":"部门1","sex":"男","remark":"备注啊","hobby":["唱歌"],"beginworkDate":"2012-06-13 00:00:00.0","photo":null,"version":null,"id":124,"degree":"本科毕业","age":20,"name":"员工2","deptId":11,"ability":2},
- {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12 00:00:00.0","photo":null,"version":null,"id":123,"degree":"本科毕业","age":20,"name":"员工3","deptId":9,"ability":2},
- {"deptName":"部门1","sex":"女","remark":"不错啊","hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12 00:00:00.0","photo":null,"version":null,"id":121,"degree":"硕士肄业","age":20,"name":"员工4","deptId":8,"ability":3},
- {"deptName":"部门1","sex":"男","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-12 00:00:00.0","photo":null,"version":null,"id":120,"degree":"博士肄业","age":20,"name":"员工5","deptId":7,"ability":4},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":119,"degree":"博士肄业","age":20,"name":"员工6","deptId":6,"ability":5},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":118,"degree":"博士肄业","age":20,"name":"员工7","deptId":6,"ability":6},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":117,"degree":"博士肄业","age":20,"name":"员工8","deptId":6,"ability":5},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":116,"degree":"博士肄业","age":20,"name":"员工9","deptId":6,"ability":3},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":115,"degree":"博士肄业","age":20,"name":"员工10","deptId":6,"ability":1},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":114,"degree":"博士肄业","age":20,"name":"员工11","deptId":6,"ability":5},
- {"deptName":"部门2","sex":"女","remark":null,"hobby":["唱歌","跳舞"],"beginworkDate":"2012-06-05 00:00:00.0","photo":null,"version":null,"id":113,"degree":"博士肄业","age":20,"name":"员工12","deptId":6,"ability":5}
- ]}
-
- //数据表格使用
- var g;
- function initComplete(){
- g = $("#maingrid").quiGrid({
- /*
- columns: [
- { display: '姓名', name: 'name', align: 'center', width: "30%"},
- { display: '性别', name: 'sex', align: 'center' , width: "20%"},
- { display: '部门', name: 'deptName', align: 'center' , width: "30%"},
- { display: '学历', name: 'degree', align: 'center', width: "20%" }
- ], data:testData, pageSize: 10, rownumbers:true, checkbox:true,percentWidthMode:true,
- height: '100%', width:"100%"
- */
- columns : [
- {
- display : '姓名',
- name : 'name',
- align : 'left',
- width : "20%"
- },
- {
- display: '性别',
- name: 'sex',
- align: 'left',
- width: "20%"
- },
- {
- display: '身份证号',
- name: 'hobby',
- align: 'left',
- width: "20%"
- },
- {
- display: '出生地',
- name: 'degree',
- align: 'left',
- width: "20%"
- },
- {
- display: '更新日期',
- name: 'beginworkDate',
- align: 'left',
- width: "20%"
- },
- {
- display : '操作',
- isAllowHide : false,
- align : 'left',
- width : 80,
- resizable:false,
- render : function(rowdata, rowindex, value,
- column) {
- return '<div class="padding_top4 padding_left5">'
-
- + '<span class="img_view hand" title="详细" n="' + rowdata.XM + '" bh="' + rowdata.BH + '" onclick="onView(this)"></span>'
- //+ '<span class="img_edit hand" title="修改" onclick="onEdit('
- //+ rowdata.BH
- //+ ')"></span>'
- + '<span class="img_delete hand" title="注销" onclick="onDelete('
- + rowdata.BH
- + ','
- + rowindex
- + ')"></span>' + '</div>';
- }
- } ],
- data:testData,
- sortName : 'name',
- rownumbers : true,
- checkbox : true,
- height : '100%',
- width: "100%",
- usePager: true,
- page : 1,
- pageSize: 20,
- percentWidthMode: true,
- checkbox: true,
- groupColumnName: "sex",
- groupColumnDisplay: '性别',
- groupRender: function(groupValue, groupData, groupColumnDisplay){
- switch(groupValue)
- {
- case "女":
- return "<font color=red>女性【共" + groupData.length + "人】</font>";
- break;
- case "男":
- return "男性【共" + groupData.length + "人】";
- break;
- default:
- return "其他【共" + groupData.length + "人】";
- break;
-
- }
- },
- toolbar : {
- items : [ {
- text: '新增',
- iconClass : 'icon_add'
- }, {
- line : true
- }, {
- text : '批量删除',
- iconClass : 'icon_delete'
- }, {
- line : true
- }, {
- text : '导入',
- iconClass : 'icon_import'
- }, {
- line : true
- }, {
- text : '导出当前页',
- iconClass : 'icon_export'
- }, {
- line : true
- }, {
- text : '导出全部',
- iconClass : 'icon_export'
- } ]
- }
- });
- }
-
- </script>
- </body>
- </html>
|
