代码如下:
<!-- 表格 --> <table id="dg"></table> <script type="text/javascript"> //ajax请求json列表数据,填充到表格 $("#dg").datagrid({ url:'<%=path%>/app/cwmeeting/xml/conferee_xml.jsp', scrollbarSize:0,//滚动条 singleSelect:true, rownumbers : true,//显示带有行号的列 fitColumns : true,//会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚 queryParams : {//当请求远程数据时,发送的额外参数 cwm_id:"<%=cwm_id%>", issue_id:"<%=id%>" }, //fitColumns : true,//使列自动展开/折叠以适应数据网格(datagrid)的宽度 loadMsg : "请稍后,数据正在加载",//加载提示信息 columns : [ [ { width : fixWidth(0.2), title : '姓名', align:'center', field : 'fsname', sortable : true }, { width : fixWidth(0.2), title : '单位', align:'center', field : 'fsdeptid', sortable : true }, { width : fixWidth(0.2), title : '联系电话', align:'center', field : 'fsmobile', sortable : true }, { width : fixWidth(0.2), title : '是否有签到权限', align:'center', field : 'issign', sortable : true, formatter:function(value,row,index){ var id=''+row.cp_id+''; var value=value; if(row.issign=="1"){ return '<a href="javascript:issign(\''+id+'\',\''+value+'\')"><font color="green" face="宋体" size="5">是</font></a>'; }else{ return '<a href="javascript:issign(\''+id+'\',\''+value+'\')"><font color="red" face="宋体" size="5">否</font></a>'; } } }, { width : fixWidth(0.2), title : '是否有表决权限', align:'center', field : 'isvote', sortable : true, formatter:function(value,row,index){ var id=''+row.cp_id+''; if(row.isvote=="1"){ return '<a href="javascript:isvote(\''+id+'\',\''+value+'\')"><font color="green" face="宋体" size="5">是</font></a>'; }else{ return '<a href="javascript:isvote(\''+id+'\',\''+value+'\')"><font color="red" face="宋体" size="5">否</font></a>'; } } }, ]]});
//easyui表格高度 function fixHeight(percent){ return (document.body.clientHeight) * percent ; } //easyui表格宽度 function fixWidth(percent){ return (document.body.clientWidth - 5) * percent ; } </script> |
效果图如下:
注意事项:
1.scrollbarSize:0,//滚动条
这个属性去掉垂直滚动条的,也就是右边的滚动条。
2.fitColumns : true,//会自动扩大或缩小列的尺寸以适应网格的宽度并且防止水平滚
这个属性去水平方向的滚动条的,也就是下边的滚动条