效果图:
在open2.jsp中:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ include file="/WEB-INF/views/include/tags.jsp"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <%@ include file="/WEB-INF/views/include/basic-head.jsp"%> <%@ include file="/WEB-INF/views/include/easyui-head.jsp"%> <title>使用easyui</title> <script type="text/javascript" src="static/js/index/msgletters/msgletters2.js"></script> </head> <body class="easyui-layout layout" > <div data-options="region:'center'" > <table id="entityGrid" style="font-size: 14px;"></table> <div id="tb" > 关键字:<input id="xxkbkey" class="easyui-textbox" style="width:180px;margin-top: 4px;height:20px;"> 开始日期:<input id="startdate" style="width:90px;" editable="true" class="easyui-datebox" ></input> 结束日期:<input id="enddate" style="width:90px;" editable="true" class="easyui-datebox" ></input> <a id="btn1" href="javascript:void(0);" class="easyui-linkbutton" plain="true" iconCls="icon-search" οnclick="searchT()">查询</a> </div> </div> </body> </html>
在msgletters2.js中:
$(document).ready(function(){
//获取当前网址,如: http://localhost:8088/test/test.jsp var curPath=window.document.location.href; //获取主机地址之后的目录,如: test/test.jsp var pathName=window.document.location.pathname; var pos=curPath.indexOf(pathName); //获取主机地址,如: http://localhost:8088 var localhostPaht=curPath.substring(0,pos); //获取带"/"的项目名,如:/test var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1); var path2=localhostPaht+projectName; load(path2); //项目路径不能写死 }); function load(path2){ $('#entityGrid').datagrid({ pageSize:20, //每页显示多少条数据 url:path + '/indexmore/msgletters2', title: '信息快报列表', height:'auto', rownumbers:true, fit:true, idField:'id', toolbar:'#tb', //把时间搜索框显示在上面,下面的分页工具也能显示出来;没有该属性,分页工具显示不出来,被隐藏了; singleSelect:true, pagination:true, //分页 nowrap:false, //自动换行 columns:[[ {field:'filename',title:'标题',width:270, formatter: function(value,row,index){ /* if(row.filename.length >=23){ var msg = row.filename.substring(0,22)+'...'; return '<a target="_blank" href="http://localhost/ybzx/pop/getStartOffice?zhizuoflag=1&docname='+row.uploadfilename +'" title='+row.filename+'>'+msg+'</a>'; }else{*/ return '<a target="_blank" href="'+path2+'/pop/getStartOffice?zhizuoflag=1&docname='+row.uploadfilename +'" title='+row.filename+'>'+row.filename+'</a>'; //} } }, {field:'model',title:'摘要',width:420, formatter: function(value,row,index){ /*if(row.model !=null && row.model.length >=25){ var msg = row.model.substring(0,20)+'...'; return '<a target="_blank" href="http://localhost/ybzx/pop/getStartOffice?zhizuoflag=1&docname='+row.uploadfilename +'" title='+row.model+'>'+msg+'</a>'; }else{*/ return '<a target="_blank" href="'+path2+'/pop/getStartOffice?zhizuoflag=1&docname='+row.uploadfilename +'" title='+row.model+'>'+row.model+'</a>'; //} }}, {field:'seltype',title:'选择类型',width:80}, {field:'istime',title:'时间',width:130}, /*{field:'uploadfilename',title:'下载',width:80, formatter : function(value, row, index) { var html = ''; html = '<a href="javascript:void(0);" οnclick="downloadfile(\'' + row.uploadfilename + '\',\'' + row.spath + '\',\''+row.id+'\')" >下载</a>'; return html; }}*/ ]], onLoadSuccess:function(data) { $(".note").tooltip( { onShow: function(){ $(this).tooltip('tip').css({ width:'200', boxShadow: '1px 1px 3px #dff5ff' }); } } ); } }); var p = $('#entityGrid').datagrid('getPager'); $(p).pagination({ pageSize:20, showPageList:false, displayMsg : '当前显示从{from}到{to}共{total}记录', onSelectPage: function(pageNumber, pageSize){ var page=pageNumber; var rows=pageSize; var startdate = $('#startdate').datebox('getValue'); var enddate = $('#enddate').datebox('getValue'); var xxkbkey = $('#xxkbkey').val(); searchTask(page,rows,startdate,enddate,xxkbkey); //分页查询,传入的参数 } }); function searchTask(page,rows,startdate,enddate,xxkbkey){ //分页查询方法 $.ajax({ type : "POST", url : path + '/indexmore/msgletters2', data : { page: page, rows: rows, startdate: startdate, enddate: enddate, xxkbkey: xxkbkey, }, dataType : "json", success : function(json) { $('#entityGrid').datagrid('loadData', json); } }); } } function downloadfile(uploadfilename,spath,id) { var url = path + '/indexdownload/download' + '?filename='+spath+encodeURI(uploadfilename)+".doc"; window.location.href=encodeURI(url); } function searchT() { //查询按钮 var startdate = $('#startdate').datebox('getValue');//得到的参数 var enddate = $('#enddate').datebox('getValue'); //得到的参数 var xxkbkey = $('#xxkbkey').val(); //得到的参数 $('#entityGrid').datagrid('options').pageNumber = 1; $('#entityGrid').datagrid('getPager').pagination({pageNumber: 1}); var page = $('#entityGrid').datagrid('getPager').data("pagination").options.pageNumber; var rows = $('#entityGrid').datagrid('getPager').data("pagination").options.pageSize; $.ajax({ type : "POST", url : path + '/indexmore/msgletters2', data : { page: page, rows: rows, xxkbkey: xxkbkey, startdate : startdate, enddate : enddate, }, dataType : "json", success : function(json) { $('#entityGrid').datagrid('loadData', json); } }); }