2021年1月23日:
今天正式的开始了分页查询以及标准的增删改查,并且今天了解到与以往不同的查询分页的方法那就是用ajax请求来进行查询,以下是我今天的代码:
首页代码:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>员工列表</title>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<script type="text/javascript" src="static/js/jquery.js"></script>
<link type="text/css" rel="stylesheet"
href="static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<script src="static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax({
url:"emp",
data:"p=1",
type:"GET",
dataType: "json",
success:function(result){
getemps(result);
}
})
})
function getemps(result){
var emplist=result.map.page.list;
$.each(emplist,function(){
alert(this.id);
})
}
function getpages(result){
}
</script>
</head>
<body>
<div calss="container">
<div class="row">
<div class="col-md-12">
<h1>CRUD</h1>
</div>
</div>
<div class="row">
<div class="col-md-4 col-md-offset-8">
<button class="btn btn-primary">新增</button>
<button class="btn btn-danger">删除</button>
</div>
</div>
<div class="row">
<div class="col-md-12">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>id</th>
<th>name</th>
<th>sex</th>
<th>email</th>
<th>deptname</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th>
<button class="btn btn-primary btn-sm">
<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
编辑
</button>
<button class="btn btn-danger btn-sm">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
删除
</button>
</th>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-md-6">当前 页 , 总共 页 , 总 条记录</div>
<div class="col-md-6">
</div>
</div>
</div>
</body>
</html>
明天继续学习,争取在剩下几天里把这个项目完成。