<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>jquery_easyui模板代码</title><link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.7.0/themes/default/easyui.css" /><link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.7.0/themes/icon.css" /><script type="text/javascript" src="js/jquery-easyui-1.7.0/jquery.min.js"></script><script type="text/javascript" src="js/jquery-easyui-1.7.0/jquery.easyui.min.js"></script><script type="text/javascript" src="js/jquery-easyui-1.7.0/locale/easyui-lang-zh_CN.js"></script><style> a{text-decoration:none} .datagrid-cell{/* 设置单元格的样式 */font-size:14px;height:30px;line-height:30px;} .datagrid-cell-rownumber{/* 设置行号样式 */font-size:14px;height:30px;line-height:30px;}</style></head><body><!-- 表格 --><table id="dg"></table><!-- 工具栏 --><div id="tt" style="padding: 5px; height: auto"><a href="javascript:;" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="doAdd()">上报</a><!-- 搜索栏 --><div style="margin-top: 2px; float: right"><form id="searchForm" action="" method="post"><input class="easyui-textbox" id="title" name="title" data-options="prompt:'标题'" style="width:150px;"><select class="easyui-combobox" id="type" name="type" data-options="panelHeight:'auto'" style="width:100px;"><option value="">全部类型</option><option value="0">领导活动</option><option value="1">常规信息</option><option value="2">外埠动态</option><option value="3">问题建议</option></select><select class="easyui-combobox" id="status" name="status" data-options="panelHeight:'auto'" style="width:100px;"><option value="0">选择状态</option><option value="1">汇要采用</option><option value="2">单条采用</option><option value="3">单篇采用</option></select><input class="easyui-datetimebox" id="begin" name="begin" data-options="prompt:'开始时间'" style="width:150px;"><input class="easyui-datetimebox" id="end" name="end" data-options="prompt:'结束时间'" style="width:150px;"><a href="javascript:void(0);" plain="true" class="easyui-linkbutton" iconCls="icon-search" onclick="searchGrid()">查询</a></form></div></div><script type="text/javascript">$(function(){$("#dg").datagrid({url:'http://192.168.8.95:8080/app/report/xml/xinxi_approve_list_xml.jsp',//请求的urlrownumbers : true,//显示行号fit : false,//是否填满整个窗体,true:是 false:否 如果是嵌套在easyui布局中我们一般使用true,否则这个属性我们选择falsestriped:true,//奇偶显示不同的颜色toolbar : "#tt",//定义工具栏fitColumns : true,//自动扩大或缩小列的尺寸以适应网格的宽度pagination:true,//分页,会在底部出现分页栏 true:显示分页栏 false:不显示分页栏pageNumber : 1,//当前页码pageSize : 15,//每页显示15条数据pageList : [15,20,50,100],//显示数据的选择列表loadMsg : "请稍后,数据正在加载",//加载数据时,显示的提示消息 queryParams : {//发送参数给后台 格式为 "name":"value" ,数据可以是整型,字符串"name":"value"},loadMsg : "请稍后,数据正在加载",onDblClickRow:function(index,row){//行双击事件,作用:一般我们弹窗来显示行的信息,因为有的文字很长,会显示不全alert(111);}, columns:[[{field : 'ck',checkbox : 'true',fixed:true},//这是一个带勾选的复选框{field:'title',title:'标题',align:'left',width:fixWidth(0.2)},{field:'type',title:'信息类别',align:'left',width:fixWidth(0.2),formatter:function(value,row,index){/* formatter用法1*/if('0'==value) return '领导活动';else if('1'==value) return '常规信息';else if('2'==value) return '外埠动态';else if('3'==value) return '问题建议';}},{field:'dept_name',title:'报送单位',align:'left',width:fixWidth(0.2)},{field:'create_time',title:'报送时间',align:'left',width:fixWidth(0.2),formatter:function(value,row,index){return value.substring(5,16);}},{field:'status',title:'采用状态',align:'left',width:fixWidth(0.2),formatter:function(value,row,index){if('0'==value || ''==value){return '已签收';} else {var str = [];if (value.indexOf('1') >= 0) {str.push('汇要采用');}if (value.indexOf('2') >= 0) {str.push('单条采用');}if (value.indexOf('3') >= 0) {str.push('单篇采用');}return str.join(',');}}},{field:'oper',title:'操作',align:'left',width:fixWidth(0.2),formatter:formatter}/* formatter用法2,在里面定义,外面写方法的逻辑,好处:更加整洁,可读性好,推荐 */]]});function formatter(value,row,index){var str='<div class="easyui-panel">';str +='<a href="javascript:void(0);" onclick="doEdit(\''+row.id+'\')">编辑 </a>';str +='<a href="javascript:void(0);" onclick="doDel(\''+row.id+'\')">删除</a>';str+='</div>';return str; }});/*这两句是给easyui设置列宽的 作用:因为电脑的分辨率不一样,为了兼容性*///easyui表格高度function fixHeight(percent){ return (document.body.clientHeight) * percent ; }//easyui表格宽度function fixWidth(percent){ return (document.body.clientWidth - 5) * percent ; }//刷新表格function reloadTable(){$('#dg').datagrid('reload');}//条件搜索框function searchGrid() {var title=$("#title").val();var type=$("#type").combobox('getValue');var status=$("#status").combobox('getValue');var begin=$("#begin").datetimebox('getValue');var end=$("#end").datetimebox('getValue');var param = $("#dg").datagrid("options").queryParams;param.title=title;param.type=type;param.status=status;param.begin=begin;param.end=end;$("#dg").datagrid("load");//重新加载数据表格}//新增function doAdd(){}//删除function doDel(id){parent.$.messager.confirm('提示','您确定要删除吗?',function(result){if(result){$.ajax({url:'<%=path%>/app/report/action/xxbs_delete_action.jsp',method:'post',data:{"id":id},success:function(data){if(data.status){alert(data.msg);reloadTable();/* 刷新页面 */}else{alert(data.msg);/* 输出错误信息 */}}});}});}//编辑function doEdit(id){//alert(id);add('编辑','<%=path%>/app/report/edit.jsp?id='+id,'pencil',1200,520);}</script></body>
</html>