标签:
1. easyUI实现动态列,js实现
$(‘#dg‘).datagrid({ height: 340, url: ‘${path}/salary/datas.do‘, method: ‘POST‘, //queryParams: { ‘id‘: id }, //idField: ‘产品ID‘, striped: true, fitColumns: true, //singleSelect: false, rownumbers: true, pagination: true, nowrap: false, pageSize: 10, pageList: [10, 20, 50, 100, 150, 200], showFooter: true, columns: [[ { field: ‘staffId‘, title: ‘ID‘, width: 80, align: ‘left‘ }, { field: ‘name‘, title: ‘员工姓名‘, width: 80, align: ‘left‘ }, { field: ‘beginDate‘, title: ‘开始日期‘, width: 80, align: ‘left‘ }, { field: ‘endDate‘, title: ‘结束日期‘, width: 80, align: ‘left‘ }, { field: ‘preSalary‘, title: ‘预发工资‘, width: 80, align: ‘left‘ }, { field: ‘socialInsurance‘, title: ‘社会保险‘, width: 80, align: ‘left‘ }, { field: ‘realSalary‘, title: ‘实发工资‘, width: 80, align: ‘left‘ } ]], onBeforeLoad: function (param) { }, onLoadSuccess: function (data) { }, onLoadError: function () { }, onClickCell: function (rowIndex, field, value) { //alert(field); } });
2. 实现表格字段数据格式化
<table id="dg" class="easyui-datagrid" title="Basic DataGrid" style="display:none;width:700px;height:250px" data-options="singleSelect:true,collapsible:true,url:‘${path}/staff/datas.do‘,method:‘post‘" pagination="true"> <thead> <tr> <th data-options="field:‘id‘,width:80,hidden:true">Item ID</th> <th data-options="field:‘staffNo‘,width:80">员工编号</th> <th data-options="field:‘name‘,width:80">姓名</th> <th data-options="field:‘gender‘,width:80,formatter:function(v){return ‘1‘==v ? ‘男‘:‘女‘;}">性别</th> <th data-options="field:‘age‘,width:80">年龄</th> <th data-options="field:‘joinDate‘,width:80">入职日期</th> <th data-options="field:‘degree‘,width:80,formatter:function(v,row,idx){return ‘0‘==v ? ‘博士‘ : ‘1‘==v ? ‘研究生‘ : ‘2‘==v ? ‘本科‘ : ‘3‘==v ? ‘大专‘ : ‘中专‘;}">学历</th> <th data-options="field:‘status‘,width:80,formatter:function(value,row,index){return ‘0‘ == value ? ‘正式员工‘ : ‘1‘ == value ? ‘已离职‘ : ‘试用‘;}">状态</th> </tr> </thead> </table>
标签:
原文地址:http://www.cnblogs.com/jianglong-liang/p/4642552.html