前端页面对数据库进行CRUD
1.搭建Maven结构项目
2.搭建三层项目环境.
- 导入jar包lib
- 添加配置文件src/main/resource
- 将web项目页面拷贝到工程src/main/webapp
- 添加对应的domain类
3.搭建职位管理前端页面及后台程序
- 创建职位对象类User ,添加dao、service层方法(CRUD);
注意:使用全注解开发
@Controller 控制器
@Service 业务对象
@Repository 持久层对象
@Component 组件 - 添加页面 ,用于展示User对象;
注意:富文本框的使用(富文本编辑器,Rich Text Editor, 简称 RTE, 是一种可内嵌于浏览器,所见即所得的文本编辑器。比较好的文本编辑器有kindeditor,fckeditor等。)
效果:
实现代码:
<script type="text/javascript">
//初始化富文本框
var E = window.wangEditor;
//职位描述
var editor = new E('#describe');
//任职要求
var editor2 = new E('#require');
//职位描述
var $txtDescribe = $('#txtDescribe');
//职位描述中的信息同步到隐藏域
editor.customConfig.onchange = function(html) {
$txtDescribe.val(html);
}
editor.create();
// 初始化 textarea 的值
$txtDescribe.val(editor.txt.html());
//任职要求
var $txtRequire = $('#txtRequire');
//职位描述中的信息同步到隐藏域
editor2.customConfig.onchange = function(html) {
$txtRequire.val(html);
}
editor2.create();
// 初始化 textarea 的值
//$txtRequire.val(editor2.txt.html());
editor.txt.html('${user.describes }')
editor2.txt.html('${user.requires }')
</script>
</script>
- Ajax ,用于展示部分修改数据;
ajax出现的缘由:更好的提升用户的体验,以及提升服务器的效率,减少网络中不必要的数据的传送
实现代码:
- 分页查询 ,用于展示数据;
分页存在意义:减少一次性从数据库读取较多数据
分页有两种:真分页与假分页。
假分页:从数据库一次性读取完成所有数据,但是在页面只是显示部分数据
好处:翻页快,功能实现简单,只适合小数据量 且不会经常修改的数据
劣势:占用内存大
真分页:每次从数据库读取部分数据
好处:占用内存小
劣势:翻页慢
它查询数据是匀速的
真分页:数据对象
① 每页多少条数据 pagesize=3
② 一共多少条数据 totallist
③ 当前第几页 currentpage
④ 首页 firstpage
⑤ 上一页 prepage
⑥ 下一页 nextpage
⑦ 尾页 lastpage
⑧ 总页数 totalpage
其