java实现数据的分页显示

在这里插入图片描述
PS:
看这个分页可以结合我上一篇的多级联动,分页显示是在多级联动之后显示的数据进行分页显示

1.导入分页的jar包

直接在pom.xml里面加

			<!-- 导入pageHelper  -->
	    <dependency>
		    <groupId>com.github.pagehelper</groupId>
		    <artifactId>pagehelper</artifactId>
		    <version>5.0.0</version>
		</dependency>

2.确定前端需要返回的参数

在前端页面中定义全局变量
在这里插入图片描述

3.SqlMapConfig.xml添加分页插件配置

        <plugins>
	    <plugin interceptor="com.github.pagehelper.PageInterceptor">
	        <property name="helperDialect" value="mysql" />
            <property name="reasonable" value="true" />
            <property name="supportMethodsArguments" value="true" />
            <property name="params" value="count=countSql" />
            <property name="autoRuntimeDialect" value="true" />
	    </plugin>
	</plugins>

4.写java后端的代码

4.1dao层

	/**
	 * 通过地区ID获取公司列表
	 * @param districtId
	 * @return
	 */
	public List<Company> getCompanyListById(String districtId);

4.2Service层

	@Autowired
	private CompanyDao companyDao;
	/**
	 * 根据地区ID获取公司列表
	 * @param districtId
	 * @return
	 */
	public List<Company> getCompanyListById(String districtId,int nowpagenumber,int length){
		PageHelper.startPage(nowpagenumber, length);//设置紧跟着的查询请求,分页 效果
		return companyDao.getCompanyListById(districtId);
	}

4.3Controller

	//自动载入
	@Autowired
	private CompanyService companyService;
	//请求地址
	@RequestMapping(value="/getCompanyListById.do")
	//返回给前段一个json形式的数据,使用该注解需要在spring-mvc配置<mvc:annotation-driven/>,否则注解失效,前段无法接受到数据
	@ResponseBody
	public Map<String,Object> getCompanyListById(@RequestParam String districtId,@RequestParam int nowPageNumber,@RequestParam int length){
		List<Company> list=companyService.getCompanyListById(districtId,nowPageNumber,length);
		Map<String,Object> map=new HashMap<>();
		//设置当前查询的数据
		map.put("resultlist", list);
		//设置当前页面数
		map.put("nowpagenumber", nowPageNumber);
		PageInfo<Company> page=new PageInfo<Company>(list);
		map.put("countNumber", page.getPages());
		return map;
	}

5.写前端页面

前端用的jsp

//分页操作
function getCompanyInfo(nowpn){
        	$.ajax({
        		url:'/ssm/getCompanyListById.do',
        		type:'POST',
        		data:{
        			districtId:districtId,
        			nowPageNumber:nowpn,
        			length:length
        		},
        		dataType:'JSON',
        		success:function(map){
        			console.log(map)
        			pageCount=map.countNumber;
        			result=map.resultlist;
        			nowpagenumber=map.nowpagenumber;
        			console.log(nowpagenumber);
        			console.log(pageCount);
        			 str = "";
                     for (var i = 0; i < result.length; i++) {
                         str += "<tr>";
                         str+="<td>"+(i+1)+"</td>";
 						str += '<td><input type="text" value="'+result[i].name+'" disabled="disabled" class="update" id="companyname'+result[i].id+'"/></td>';
 						str += '<td><input type="text" value="'+result[i].introduce+'" disabled="disabled" class="update" id="companyintroduce'+result[i].id+'"/></td>';
 						str += '<td><input type="text" value="'+result[i].post+'" disabled="disabled" class="update" id="companypost'+result[i].id+'"/></td>';
 						str += '<td><input type="text" value="'+result[i].num+'" disabled="disabled" class="update" id="companynum'+result[i].id+'"/></td>';
 						str += '<td><input type="text" value="'+result[i].salary+'" disabled="disabled" class="update" id="companysalary'+result[i].id+'"/></td>';
 						str += '<td class="edit"><a href="javascript:btn_edit('+result[i].id+',this)" id="a'+result[i].id+'">编辑</a></td>';
 						str += '<td class="delete"><a href="javascript:btn_delete('+result[i].id+',this)">删除</a></td>';
                        str += "</tr>";
                     }
                     $("#tbody").append(str);
//                   alert("显示页码")
                     //显示页码部分
                     $("#pageshow").empty();//清空页码显示栏
                     num_str="<li><a href='javascript:getDataBypageNumber("+(nowpn-1)+")'>&lt;&lt;</a></li>";
                     for(var i=1;i<=pageCount;i++){
                    	 if(i==nowpagenumber){
                    		 num_str+="<li><a href='#' class='nowpage'>"+i+"</a></li>";
                    	 }else{
                    		 num_str +="<li><a href='javascript:getDataBypageNumber("+i+")'>"+i+"</a></li>";
                    	 }
                     }
                     num_str += "<li><a href='javascript:getDataBypageNumber("+(nowpn+1)+")'>&gt;&gt;</a></li>";
                     console.log(num_str)
                     $('#pageshow').append(num_str)
        		},
        		error:function(e){
        			alert("网络连接错误");
        		}
        	});
        }

边界检测

       function getDataBypageNumber(pn){
        	if(pn<1){
        		alert("已经是第一页了")
        		return;
        	}else if(pn>pageCount){
        		alert("已经是最后一页了")
        		return;
        	}
        	getCompanyInfo(pn);
        }

这里使用的是物理分页,使用了PageHelper插件帮我们自动实现limit限制,还是蛮方便的
物理分页优点:数据量特别大,不会导致内存的溢出.
缺点:经常需要和数据库交互.

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值