基于Springmvc+Mybatis+Spring+Freemarker的物理分頁插件(超級(jí)簡單)

2019-11-06 06:16:09

字體：大中小

供稿：網(wǎng)友

1.先上效果圖(不怎么好看，主要看功能)

2.實(shí)現(xiàn)(Maven項(xiàng)目)

2.1配置pom.xml文件

		<!-- 物理分頁 -->		<dependency>			<groupId>com.github.pagehelper</groupId>			<artifactId>pagehelper</artifactId>			<version>5.0.0</version>		</dependency>2.2配置Pagehelper核心攔截器
	<bean id="sqlsessionFactory" class="org.mybatis.sPRing.SqlSessionFactoryBean"		p:dataSource-ref="dataSource" p:mapperLocations="classpath:com/exp/phone/mapping/*.xml">		<property name="plugins">		    <array>		      <bean class="com.github.pagehelper.PageInterceptor">		      <property name="properties">		      <value>		      helperDialect=MySQL		      supportMethodsArguments=true		      </value>		      </property>		      </bean>		    </array>		 </property>	</bean>		<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">          <property name="basePackage" value="com.exp.phone.dao" />          <property name="sqlSessionFactoryBeanName" value="sqlSessionFactory" />      </bean> 	        <bean id="transactionManager"          class="org.springframework.jdbc.datasource.DataSourceTransactionManager">          <property name="dataSource" ref="dataSource" />      </bean>  2.3使用(后端)
	@RequestMapping("/list")	public String list(Model model,@RequestParam(value="pageNum", defaultValue="1") int pageNum, 			@RequestParam(value="pageSize", defaultValue="3") int pageSize){		PageHelper.startPage(pageNum, pageSize);		List<User> list = userService.list(new HashMap());		PageInfo page = new PageInfo(list);		model.addAttribute("page",page);		return "freeMarker";			}2.4使用(前端)
<#setting classic_compatible=true><#assign base=request.contextPath /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>User List</title><link href=" ${base}/bootstrap/CSS/bootstrap.min.css" rel="stylesheet"><style>li{float: left; list-style: none;margin: 10px;}.active{background-color: red}</style></head><body>	<h3>總記錄：${page.total}</h3>	<h3>是否為第一頁：${page.isFirstPage}</h3>	<h3>是否為最后一頁：${page.isLastPage}</h3>	<h3>導(dǎo)航頁碼數(shù)：${page.navigatePages}</h3>	<h3>導(dǎo)航條上的第一頁：${page.navigateFirstPage}</h3>	<h3>導(dǎo)航條上的最后一頁：${page.navigateLastPage}</h3>	<h3>上一頁：${page.prePage}</h3>	<h3>下一頁：${page.nextPage}</h3>	<h3>總頁數(shù)：${page.pages}</h3> 	<table  border="1" class="table table-striped">		<thead>			<tr>				<th width="40%">Username</th>				<th width="30%">Phone</th>				<th width="30%">Sex</th>			</tr>		</thead>		<tbody>			<#if page.list??>				<#list page.list as item>				<tr>							<td>${item.username}</td>							<td>${item.phone}</td>							<td>${(item.sex == 1)?string("男","女")}</td>				<tr>				</#list>			<#else>				<p>	抱歉!暫時(shí)無數(shù)據(jù) </p>			</#if>		</tbody>			</table>	<div class="message">			共<i class="blue">${page.total}</i>條記錄，當(dāng)前顯示第 <i				class="blue">${page.pageNum}/${page.pages}</i> 頁		</div>		<div style="text-align:center;">			<ul class="pagination">								<#if !page.isFirstPage >					<li><a href="javascript:queryAll(${page.firstPage}, ${page.pageSize});"><<</a></li>					<li><a href="Javascript:queryAll(${page.prePage}, ${page.pageSize});"><</a></li>				</#if>				<#list page.navigatepageNums as navigatepageNum>					<#if navigatepageNum==page.pageNum>						<li class="active"><a href="javascript:queryAll(${navigatepageNum}, ${page.pageSize});">${navigatepageNum}</a></li>					</#if>					<#if navigatepageNum!=page.pageNum>						<li><a href="javascript:queryAll(${navigatepageNum}, ${page.pageSize});">${navigatepageNum}</a></li>					</#if>				</#list>				<#if !page.isLastPage>					<li><a href="javascript:queryAll(${page.nextPage}, ${page.pageSize});">></a></li>					<li><a href="javascript:queryAll(${page.lastPage}, ${page.pageSize});">>></a></li>				</#if>							</ul>	</div><script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script><script type="text/javascript">	function queryAll(pageNum, pageSize){		document.location.href="http://localhost/phoneRegisterandAngularJS/pageHelperController/list?pageNum="+pageNum;}</script></body></html>