信息快报搜索功能模块：Easyui中的分页和自动换行

本文链接：https://blog.csdn.net/u013456370/article/details/61191449

效果图：

在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);
}
});
}