查询
打开列表界面
WEB-INF/pages/company/company-list.jsp
CompanyController
@RequestMapping(path="/toList",method = RequestMethod.GET)
public String toList(Model model){
//调service获取数据
List<Company> list = service.queryAllCompany();
logger.info("toList list="+list);
model.addAttribute("list",list);
//将数据发到页面，使用标签
return "company/company-list";
}
后台代码
ICompanyServiceTest
@Test
public void queryAllCompany() {
System.out.println(companyService);
List<Company> list = companyService.queryAllCompany();
System.out.println(list);
}
ICompanyService
List<Company> queryAllCompany();
CompanyServiceImpl
public List<Company> queryAllCompany() {
List<Company> list = companyDao.queryAll();
return list;
}
ICompanyDao
//查询所有公司记录
//SELECT * FROM `ss_company`;
List<Company> queryAll();
ICompanyDao.xml
<!--
项目名与字段名不一致时
有两种解决方法：
1.sql别名
2.resultMap标签
两种方法，凭个人喜好选择
-->
<resultMap id="queryAllMap" type="company" autoMapping="true">
<result property="expirationDate" column="expiration_date"/>
<result column="license_id" property="licenseId"/>
<result property="companySize" column="company_size"/>
</resultMap>
<select id="queryAll" resultMap="queryAllMap">
/*1.sql别名*/
/* SELECT
id,
name,
expiration_date as expirationDate,
address ,
license_id as licenseId,
representative ,
phone,
company_size as companySize,
industry ,
remarks ,
state ,
balance ,
city
FROM ss_company;*/
/*2.resultMap标签*/
select * from ss_company
</select>
运行，先从bean->dao->service->web,先clean再install，否则会出现符号异常
前台代码
company-list.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="../base.jsp"%>
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>数据 - AdminLTE2定制版</title>
<meta name="description" content="AdminLTE2定制版">
<meta name="keywords" content="AdminLTE2定制版">
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<script src="${path}/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script>
function del() {
var id = getCheckId();
if(id){
if(confirm("您确定要删除该条信息吗？")){
location.href="${path}/company/delete.do?id="+id;
}
}else{
alert("请勾选待处理的信息，且每次只能勾选一个");
}
}
</script>
</head>
<body>
<div id="frameContent" class="content-wrapper" style="margin-left:0px;">
<!-- 内容头部 -->
<section class="content-header">
<h1>
企业管理
<small>企业列表</small>
</h1>
<%--<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
<li><a href="#">数据管理</a></li>
<li class="active">数据列表</li>
</ol>--%>
</section>
<!-- 内容头部 /-->
<!-- 正文区域 -->
<section class="content">
<!-- .box-body -->
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">列表</h3>
</div>
<div class="box-body">
<%--${list}--%>
<!-- 数据表格 -->
<div class="table-box">
<!--工具栏-->
<div class="pull-left">
<div class="form-group form-inline">
<div class="btn-group">
<button type="button" class="btn btn-default" title="新建" onclick="location.href='${path}/company/addUI.do'"><i class="fa fa-file-o"></i> 新建</button>
<button type="button" class="btn btn-default" title="删除" onclick="del()"><i class="fa fa-trash-o"></i> 删除</button>
<%-- <button type="button" class="btn btn-default" title="开启"><i class="fa fa-check"></i> 开启</button>--%>
<%-- <button type="button" class="btn btn-default" title="屏蔽"><i class="fa fa-ban"></i> 屏蔽</button>--%>
<button type="button" class="btn btn-default" title="刷新" onclick="window.location.reload();"><i class="fa fa-refresh"></i> 刷新</button>
</div>
</div>
</div>
<div class="box-tools pull-right">
<div class="has-feedback">
<input type="text" class="form-control input-sm" placeholder="搜索">
<span class="glyphicon glyphicon-search form-control-feedback"></span>
</div>
</div>
<!--工具栏/-->
<!--数据列表-->
<table id="dataList" class="table table-bordered table-striped table-hover dataTable">
<thead>
<tr>
<th class="" style="padding-right:0px;">
<input id="selall" type="checkbox" class="icheckbox_square-blue">
</th>
<th class="sorting_asc">ID</th>
<th class="sorting_desc">企业名称 [降序]</th>
<th class="sorting_asc sorting_asc_disabled">所在地 [屏蔽升序]</th>
<th class="sorting_desc sorting_desc_disabled">公司地址 [屏蔽降序]</th>
<th class="sorting">企业法人 [点击排序]</th>
<th class="text-center sorting">联系方式</th>
<th class="text-center">操作</th>
</tr>
</thead>
<tbody>
<c:forEach items="${pageInfo.list}" var="item">
<tr>
<td><input name="ids" type="checkbox" value="${item.id}"></td>
<td>${item.id}</td>
<td>${item.name}
</td>
<td>${item.city}</td>
<td>${item.address}</td>
<td>${item.representative}</td>
<td class="text-center">${item.phone}</td>
<td class="text-center">
<%-- <button type="button" class="btn bg-olive btn-xs">订单</button>--%>
<button type="button" class="btn bg-olive btn-xs" onclick="location.href='${path}/company/detail.do?id=${item.id}'">详情</button>
<button type="button" class="btn bg-olive btn-xs" onclick="location.href='${path}/company/updateUI.do?id=${item.id}'">编辑</button>
</td>
</tr>
</c:forEach>
</tbody>
<!--
<tfoot>
<tr>
<th>Rendering engine</th>
<th>Browser</th>
<th>Platform(s)</th>
<th>Engine version</th>
<th>CSS grade</th>
</tr>
</tfoot>-->
</table>
<!--数据列表/-->
</div>
<!-- 数据表格 /-->
</div>
<!-- /.box-body -->
<!-- .box-footer-->
<div class="box-footer">
<div class="pull-left">
<div class="form-group form-inline">
总共${pageInfo.pages} 页，共${pageInfo.total} 条数据。 每页
<select class="form-control" id="pageSize">
<option value="5" ${pageInfo.pageSize==5?'selected':''}>5</option>
<option value="10" ${pageInfo.pageSize==10?'selected':''}>10</option>
<option value="15" ${pageInfo.pageSize==15?'selected':''}>15</option>
<option value="20" ${pageInfo.pageSize==20?'selected':''}>20</option>
<option value="25" ${pageInfo.pageSize==25?'selected':''}>25</option>
</select> 条
</div>
</div>
<div class="box-tools pull-right">
<ul class="pagination">
<li>
<a href="javascript:goPage(1)" aria-label="Previous">首页</a>
</li>
<c:if test="${pageInfo.hasPreviousPage}">
<li><a href="javascript:goPage(${pageInfo.prePage})">上一页</a></li>
</c:if>
<c:forEach items="${pageInfo.navigatepageNums}" var="item">
<c:if test="${pageInfo.pageNum==item}">
<li class="active"><a href="javascript:void(0)">${item}</a></li>
</c:if>
<c:if test="${pageInfo.pageNum!=item}">
<li><a href="javascript:goPage(${item})">${item}</a></li>
</c:if>
</c:forEach>
<c:if test="${pageInfo.hasNextPage}">
<li><a href="javascript:goPage(${pageInfo.nextPage})">下一页</a></li>
</c:if>
<li>
<a href="javascript:goPage(${pageInfo.pages})" aria-label="Next">尾页</a>
</li>
</ul>
</div>
</div>
<!-- /.box-footer-->
<form action="${path}/company/list.do" id="pageForm" method="post">
<input type="hidden" name="curr" id="curr">
<input type="hidden" name="size" id="size">
</form>
</div>
</section>
<!-- 正文区域 /-->
</div>
<script>
function goPage(num) {
$("#curr").val(num);
$("#size").val($("#pageSize").val());
$("#pageForm").submit();
}
$(function () {
$("#pageSize").change(function () {
goPage(1);
})
})
</script>
</body>
</html>
使用foreach和el表达式等显示
问题
我们发现表的字段名过多，如果出现需要将表的所有字段或者除个别一两个字段其余字段都显示时，字段过多，会导致我们写sql语句麻烦
使用Navcat，就可以轻松解决这个问题
Navcat获取一个表的所有字段
- 逗号连接的字段列表
select group_concat(COLUMN_NAME) from information_schema.COLUMNS where table_name = '表名';
运行结果，例子：
2. 获取字段名为一列的表
SELECT COLUMN_NAME FROM information_schema.COLUMNS WHERE table_name='表名' and TABLE_SCHEMA='数据库名' ;
//数据库表名可不写，即sql语句截止到table_name表名处
运行结果：例子
使用Navcat找出表的所有字段以后，推荐使用Notepad++文本编辑器
如下图操作
删除
分析
调用service删除指定id对应的数据
后台代码
ICompanyServiceTest
@Test
public void deleteCompany(){
String id = "fc9b81af-7a8a-446f-ae9a-0333d279fe8c";
boolean flag = companyService.deleteCompany(id);
System.out.println(flag);
}
ICompanyServcie
boolean deleteCompany(String id);
CompanyServiceImpl
public boolean deleteCompany(String id) {
try {
companyDao.delete(id);
}catch (Exception e){
e.printStackTrace();
return false;
}
return true;
}
ICompanyDao
void delete(String id);
ICompanyDao.xml
<delete id="delete" parameterType="string">
DELETE from ss_company where id = #{id}
</delete>
前台代码
company-list.jsp
<script>
function del() {
var id = getCheckId();
if(id){
if(confirm("您确定要删除该条信息吗？")){
location.href="${path}/company/delete.do?id="+id;
}
}else{
alert("请勾选待处理的信息，且每次只能勾选一个");
}
}
</script>
CompanyController
@RequestMapping(path = "/delete",method = {RequestMethod.POST,RequestMethod.GET})
public String delete(String id){
logger.info("delete(String id) id="+id);
boolean flag = service.deleteCompany(id);
logger.info("delete(String id) flag="+flag);
return "redirect:/company/list.do";
}
增加
前台
添加页面
由webapp下的pages下的all-order-manager-edit.html修改而来
修改后的页面
company-add.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="../base.jsp"%>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>数据 - AdminLTE2定制版</title>
<meta name="description" content="AdminLTE2定制版">
<meta name="keywords" content="AdminLTE2定制版">
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<script src="${path}/plugins/jQuery/jquery-2.2.3.min.js"></script>
</head>
<body>
<div id="frameContent" class="content-wrapper" style="margin-left:0px;">
<!-- 内容头部 -->
<section class="content-header">
<h1>
企业管理
<small>企业添加</small>
</h1>
<ol class="breadcrumb">
<li><a href="all-admin-index.html"><i class="fa fa-dashboard"></i> 首页</a></li>
<li><a href="all-order-manage-list.html">企业管理</a></li>
<li class="active">企业添加</li>
</ol>
</section>
<!-- 内容头部 /-->
<!-- 正文区域 -->
<section class="content">
<form action="${path}/company/add.do">
<!--企业信息-->
<div class="panel panel-default">
<div class="panel-heading">企业信息</div>
<div class="row data-type">
<div class="col-md-2 title">企业名称</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="企业名称" name="name" value="">
</div>
<div class="col-md-2 title">营业执照</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="营业执照" name="licenseId" value="">
</div>
<div class="col-md-2 title">所在城市</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="所在城市" name="city" value="">
</div>
<div class="col-md-2 title">企业地址</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="企业地址" name="address" value="">
</div>
<div class="col-md-2 title">法人代表</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="法人代表" name="representative" value="">
</div>
<div class="col-md-2 title">联系电话</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="联系电话" name="phone" value="">
</div>
<div class="col-md-2 title">公司规模</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="公司规模" name="companySize" value="">
</div>
<div class="col-md-2 title">所属行业</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="所属行业" name="industry" value="">
</div>
<div class="col-md-2 title">状态</div>
<div class="col-md-4 data">
<select class="form-control select2" style="width: 100%;" name="state">
<option value="0" ${company.state==0 ? 'select':''}>未审核</option>
<option value="1" ${company.state==1 ? 'select':''}>已审核</option>
</select>
</div>
<div class="col-md-2 title">余额</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="余额" name="balance">
</div>
<div class="col-md-2 title rowHeight2x">备注</div>
<div class="col-md-10 data rowHeight2x">
<textarea class="form-control" rows="3" placeholder="备注" name="remarks"></textarea>
</div>
</div>
</div>
<!--企业信息/-->
<!--工具栏-->
<div class="box-tools text-center">
<button type="submit" class="btn bg-maroon">保存</button>
<button type="button" class="btn bg-default" onclick="history.back(-1);">返回</button>
</div>
<!--工具栏/-->
</form>
</section>
<!-- 正文区域 /-->
</div>
<script>
$(document).ready(function() {
// 激活导航位置
setSidebarActive("order-manage");
});
</script>
</body>
</html>
注意：springmvc要求表单提交的值的name属性需要和实体类的变量名对应，否则无法成功获取值
CompanyController
//打开添加界面
@RequestMapping(path = "/addUI",method = {RequestMethod.POST,RequestMethod.GET})
public String addUI(){
return "company/company-add";
}
后台
ICompanyServiceTest
@Test
public void addCompany(){
System.out.println(companyService);
Company company = new Company(UUID.randomUUID().toString(),"txun",new Date(),"shnegz","123","huaten","12564","1000","youxi","txgs",1,123.0,"shenz");
companyService.addCompany(company);
}
ICompanyService
void addCompany(Company company);
ICompanyImpl
public void addCompany(Company company) {
//当前数据库id不是自增长，需要在增加前设置
//uuid 全球唯一
String id = UUID.randomUUID().toString();
company.setId(id);
companyDao.add(company);
}
当前数据库表的id不是自增长的，需要在插入前设置。uuid，全球唯一，不重复。
ICompanyDao
void add(Company company);
ICompany.xml
<insert id="add" parameterType="company">
insert into
ss_company(id,
name,
expiration_date,
address,
license_id,
representative,
phone,
company_size,
industry,
remarks,
state,
balance,
city)
values(
#{ id },
#{ name },
#{ expirationDate },
#{ address },
#{ licenseId },
#{ representative },
#{ phone },
#{ companySize },
#{ industry },
#{ remarks },
#{ state },
#{ balance },
#{ city }
)
</insert>
写这个语句的时候可以使用前面的Tomcat与Notepad++配合，以此使得语句准备，且速度快
看操作
- 使用tomcat查询出表的所有字段
- 复制前面的获取字段名为一列的表的sql语句
SELECT COLUMN_NAME FROM information_schema.COLUMNS WHERE table_name='表名'
- 运行语句将结果表所有行复制
- 使用Notepad++同时操作多行数据，进行相同的操作
- 将复制的结果表的字段粘贴在Notepad++的文件上
- 将复制的字段再粘贴一份，并将另一份字段名修改为成员变量名
- 将sql语句的其他成分加入
编辑
编辑回显
后台
ICompanyServiceTest
@Test
public void queryCompany(){//根据id查找企业信息
String id = "c08cd654-a189-472f-ba04-3fbb97ecfa47";
Company company = companyService.queryCompany(id);
System.out.println(company);
}
ICompanyService
Company queryCompany(String id);
CompanyServiceImpl
public Company queryCompany(String id) {
Company company = companyDao.query(id);
return company;
}
ICompanyDao
Company query(String id);
ICompany.xml
<select id="query" parameterType="string" resultType="company">
SELECT
id,
name,
expiration_date as expirationDate,
address,
license_id as licenseId,
representative,
phone,
company_size as companySize,
industry,
remarks,
state,
balance,
city
FROM `ss_company`
where id=#{id};
</select>
前台
CompanyController
@RequestMapping(path = "/updateUI",method = {RequestMethod.POST,RequestMethod.GET})
public String updateUI(String id,Model model){
logger.info("updateUI(String id,Model model) id="+id);
Company company = service.queryCompany(id);
logger.info("updateUI(String id,Model model) company="+company);
model.addAttribute("company",company);
return "/company/company-update";
}
company-update.jsp
与添加页面类似
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="../base.jsp"%>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>数据 - AdminLTE2定制版</title>
<meta name="description" content="AdminLTE2定制版">
<meta name="keywords" content="AdminLTE2定制版">
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<script src="${path}/plugins/jQuery/jquery-2.2.3.min.js"></script>
</head>
<body>
<div id="frameContent" class="content-wrapper" style="margin-left:0px;">
<!-- 内容头部 -->
<section class="content-header">
<h1>
企业管理
<small>企业表单</small>
</h1>
<ol class="breadcrumb">
<li><a href="all-admin-index.html"><i class="fa fa-dashboard"></i> 首页</a></li>
<li><a href="all-order-manage-list.html">企业管理</a></li>
<li class="active">企业表单</li>
</ol>
</section>
<!-- 内容头部 /-->
<!-- 正文区域 -->
<section class="content">
<form action="${path}/company/update.do">
<!--企业信息-->
<div class="panel panel-default">
<div class="panel-heading">企业信息</div>
<div class="row data-type">
<input name="id" type="hidden" value="${company.id}">
<div class="col-md-2 title">企业名称</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="企业名称" name="name" value="${company.name}">
</div>
<div class="col-md-2 title">营业执照</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="营业执照" name="licenseId" value="${company.licenseId}">
</div>
<div class="col-md-2 title">所在城市</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="所在城市" name="city" value="${company.city}">
</div>
<div class="col-md-2 title">企业地址</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="企业地址" name="address" value="${company.address}">
</div>
<div class="col-md-2 title">法人代表</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="法人代表" name="representative" value="${company.representative}">
</div>
<div class="col-md-2 title">联系电话</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="联系电话" name="phone" value="${company.phone}">
</div>
<div class="col-md-2 title">公司规模</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="公司规模" name="companySize" value="${company.companySize}">
</div>
<div class="col-md-2 title">所属行业</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="所属行业" name="industry" value="${company.industry}">
</div>
<div class="col-md-2 title">状态</div>
<div class="col-md-4 data">
<select class="form-control select2" style="width: 100%;" name="state">
<option value="0" ${company.state==0 ? 'selected':''}>未审核</option>
<option value="1" ${company.state==1 ? 'selected':''}>已审核</option>
</select>
</div>
<div class="col-md-2 title">余额</div>
<div class="col-md-4 data">
<input type="text" class="form-control" placeholder="余额" name="balance" value="${company.balance}">
</div>
<div class="col-md-2 title rowHeight2x">备注</div>
<div class="col-md-10 data rowHeight2x">
<textarea class="form-control" rows="3" placeholder="备注" name="remarks" >${company.remarks}</textarea>
</div>
</div>
</div>
<!--企业信息/-->
<!--工具栏-->
<div class="box-tools text-center">
<button type="submit" class="btn bg-maroon">保存</button>
<button type="button" class="btn bg-default" onclick="history.back(-1);">返回</button>
</div>
<!--工具栏/-->
</form>
</section>
<!-- 正文区域 /-->
</div>
<script>
$(document).ready(function() {
// 激活导航位置
setSidebarActive("order-manage");
});
</script>
</body>
</html>
编辑保存
分析
更新，就是将回显的数据，经过修改以后，同步保存到数据库中
后台代码
ICompanyServiceTest
@Test
public void updateCompany(){
Company company = new Company("904321e5-83c5-4139-ab99-38dadc9f65ef","txun",new Date(),"shnegz","123","huaten","12564","1000","youxi","txgs",1,123.0,"shenz");
boolean flag = companyService.updateCompany(company);
System.out.println(flag);
}
ICompanyService
boolean updateCompany(Company company);
CompanyServiceImpl
public boolean updateCompany(Company company) {
try{
companyDao.update(company);
}catch (Exception e){
e.printStackTrace();
return false;
}
return true;
}
ICompanyDao
void update(Company company);
ICompanyDao.xml
<update id="update" parameterType="company">
update ss_company set
name=#{ name } ,
expiration_date=#{ expirationDate } ,
address=#{ address } ,
license_id=#{ licenseId } ,
representative=#{ representative } ,
phone=#{ phone } ,
company_size=#{ companySize } ,
industry=#{ industry } ,
remarks=#{ remarks } ,
state=#{ state } ,
balance=#{ balance } ,
city=#{ city }
where id = #{id}
</update>
sql语句可以如前面写增加一般写，会快且准确
前台
company-update.jsp
action="${path}/company/update.do"
CompanyController
@RequestMapping(path = "/update",method = {RequestMethod.POST,RequestMethod.GET})
public String update(Company company){
logger.info("update(Company company) company="+company);
boolean flag = service.updateCompany(company);
logger.info("update(Company company) flag="+flag);
return "redirect:/company/list.do";
}
分页
分页显示
前台
页面
分页页面使用到的数据有4个整数和一个集合，参考PageBean
pagehelper使用
- 依赖
加入到父项目的pom.xml文件底下
<!-- mybatis分页插件 -->
<dependency>
<groupId>com.github.miemiedev</groupId>
<artifactId>mybatis-paginator</artifactId>
<version>${mybatis.paginator.version}</version>
</dependency>
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>${pagehelper.version}</version>
</dependency>
- 配置
配置有两种方式
<!-- 配置分页插件pagehelper -->
<property name="plugins">
<array>
<bean class="com.github.pagehelper.PageInterceptor">
<property name="properties">
<!--使用下面的方式配置参数，一行配置一个 -->
<!-- pageNum<=0 时会查询第一页 -->
<!-- 指定数据库方言 -->
<value>
reasonable=true
helperDialect=mysql
</value>
</property>
</bean>
</array>
</property>
在子项目dao底下的resources文件夹下的spring文件夹的applicationContext.xml中加入该代码
后台代码
按照指定的 页号获取数据
按照指定的 每页记录数来获取数据
ICompanyServiceTest
@Test
public void querypage(){
int currentPage = 1;
int pageSize = 5;
//PageInfo 包含四个整数，一个集合
PageInfo<Company> pageInfo = companyService.queryPage(currentPage,pageSize);
System.out.println(pageInfo);
}
ICompanyService
PageInfo<Company> queryPage(int currentPage, int pageSize);
CompanyServiceImpl
public PageInfo<Company> queryPage(int currentPage, int pageSize) {
//设置参数
PageHelper.startPage(currentPage,pageSize);
//查询由拦截器在select * from ss_company基础上，生成
//select count(*) from ss_company
//select * form ss_company limit (currentPage-1)*pageSize,pageSize
List<Company> list = companyDao.queryAll();
//将集合封装
PageInfo<Company> pageInfo = new PageInfo<Company>(list);
return pageInfo;
}
ICompanyDao
由于只是调用了查找方法，所以没有新的方法创建
ICompanyDao.xml
与类相对应，xml文件也没有新的语句，但如果查找语句的sql最后有分号(;)的话，需要删除该分号，否则执行时会报错，因为插件是在对应语句后面加语句内容，有分号(;)会导致sql语句异常
分页列表
jsp代码重用
- jsp代码是可以重用的
- jsp代码如何重用
建立jsp页面A，保存重用代码
在当前页面B中引入A
<jsp:include page="A.jsp" />
- 页面B可以将参数传给页面A
//在B页面的<jsp:include page></jsp:include>表情中写参数
<jsp:param name="key" value="value" />
//在A页面取
${param.key}
demo02.jsp
<body>
<%-- 子标签param，将k-v值传给被include页面 --%>
<jsp:include page="demo02_common.jsp">
<jsp:param name="jack" value="rose"/>
<jsp:param name="url" value="www.baidu.com"/>
</jsp:include>
我是主要内容
<jsp:include page="demo02_common.jsp"></jsp:include>
</body>
demo02_common.jsp
<body>
<h1>我是可以重用的jsp代码部分</h1>
${param.jack}
${param.url}//分页需要使用地址参数
</body>
jsp代码重用-分页代码
- 分页工具条肯定是可以重用的
page.jsp
company-list.jsp
<!-- .box-footer-->
<div class="box-footer">
<jsp:include page="../common/page.jsp">
<jsp:param name="pageUrl" value="${path}/company/list.do"/>
</jsp:include>
</div>
<!-- /.box-footer-->
page.jsp
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<body>
<div class="pull-left">
<div class="form-group form-inline">
总共${pageInfo.pages} 页，共${pageInfo.total} 条数据。 每页
<select class="form-control" id="pageSize">
<option value="5" ${pageInfo.pageSize==5?'selected':''}>5</option>
<option value="10" ${pageInfo.pageSize==10?'selected':''}>10</option>
<option value="15" ${pageInfo.pageSize==15?'selected':''}>15</option>
<option value="20" ${pageInfo.pageSize==20?'selected':''}>20</option>
<option value="25" ${pageInfo.pageSize==25?'selected':''}>25</option>
</select> 条
</div>
</div>
<div class="box-tools pull-right">
<ul class="pagination">
<li>
<a href="javascript:goPage(1)" aria-label="Previous">首页</a>
</li>
<c:if test="${pageInfo.hasPreviousPage}">
<li><a href="javascript:goPage(${pageInfo.prePage})">上一页</a></li>
</c:if>
<c:forEach items="${pageInfo.navigatepageNums}" var="item">
<c:if test="${pageInfo.pageNum==item}">
<li class="active"><a href="javascript:void(0)">${item}</a></li>
</c:if>
<c:if test="${pageInfo.pageNum!=item}">
<li><a href="javascript:goPage(${item})">${item}</a></li>
</c:if>
</c:forEach>
<c:if test="${pageInfo.hasNextPage}">
<li><a href="javascript:goPage(${pageInfo.nextPage})">下一页</a></li>
</c:if>
<li>
<a href="javascript:goPage(${pageInfo.pages})" aria-label="Next">尾页</a>
</li>
</ul>
</div>
<form action="${param.pageUrl}" id="pageForm" method="post">
<input type="hidden" name="curr" id="curr">
<input type="hidden" name="size" id="size">
</form>
<script>
function goPage(num) {
$("#curr").val(num);
$("#size").val($("#pageSize").val());
$("#pageForm").submit();
}
$(function () {
$("#pageSize").change(function () {
goPage(1);
})
})
</script>
</body>
</html>
- 修改页面的EL表达式
304
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
