JFinal增删改查实践
经过一段时间的学习,对JFinal已有基本的认知。这还远远不够,学习的目的是为了实际的运用。所以这次我们直接实际去完成一个用JFinal实现的功能。
模块名称:简历管理
包含功能:添加、查询、修改与删除。
根据我个人的思路,我会先了解这个模块的基本信息,建立数据库与表。
接下来就是代码书写。我使用了现成的框架 去添加 简历管理模块。
先是在配置文件中添加路径
@Override
public void config() {
add("/sys/cmkj", ChuangmengController.class, "/WEB-INF/view/chuangmeng");
}
我先是在model层书写了功能的实现方法。
public InvokeResult save(Chuangmeng chuangmeng){
try {
boolean flag = false;
if (chuangmeng.getId() == null) {
flag = chuangmeng.save();
} else {
flag = chuangmeng.update();
}
if (flag) {
return InvokeResult.success();
} else {
return InvokeResult.failure("保存部门信息失败!");
}
} catch (Exception e) {
e.printStackTrace();
return InvokeResult.failure("保存用户信息失败!");
}
}
public List<Record> getUsers() {
try {
return Db.find("select t.id, t.name as text from chuangmeng t where t.1 = 1");
} catch (Exception e) {
throw new RuntimeException("获取用户列表异常:"+e.getMessage());
}
}
public InvokeResult delete(String ids) {
String idarr[] = ids.split(",");
for(String id : idarr){
if (!Chuangmeng.dao.findById(id).delete()) {
throw new RuntimeException(id+"批量删除失败");
}
}
return InvokeResult.success();
}
获取列表和保存与删除方法。
接下来就是Controller层的书写 有了方法就要去调用。
public class ChuangmengController extends BaseController {
public void index() {
render("chuangmeng.jsp");
}
public void form() {
Integer id=this.getParaToInt("id");
if(id != null){
this.setAttr("chuangmeng", Chuangmeng.dao.findById(id));
}
render("chuangmengForm.jsp");
}
/**
* 获取用户列表
*/
public void getList() {
String name=this.getPara("name");
Page<Chuangmeng> pageInfo=Chuangmeng.dao.getChuangmengPage(getPage(), getRows(), name, getOrderbyStr());
this.renderJson(DataGridModelUtils.toDataGridView(pageInfo));
}
/**
* 保存/修改用户信息
*/
public void save(){
try{
InvokeResult result=Chuangmeng.dao.save(getModel(Chuangmeng.class));
this.renderJson(result);
}catch(Exception e){
e.printStackTrace();
}
}
/**
* 用户删除
*/
public void delete() {
try {
String ids = getPara("ids");
InvokeResult result = Chuangmeng.dao.delete(ids);
this.renderJson(result);
} catch (Exception e) {
e.printStackTrace();
}
}
接着就是view层的书写,Controller层的作用就是响应前端页面的请求,view就是模块的前端页面。
创建.jsp文件。在Controller的顶端写上关联代码。
我建立了两个jsp文件 一个是模块展示页面 另一个是保存页面要填写的信息。
模块展示里 都有删改查的请求代码,
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>职员管理</title>
<link rel="stylesheet" href="${ctx}/static/admin/css/switch.css">
</head>
<body>
<div class="layui-card-body">
<button class="layui-btn layui-btn-sm" id="add">添加</button>
<button class="layui-btn layui-btn-sm" id="search_sidebar"><i class="layui-icon layui-icon-search"></i></button>
<table class="layui-hide" id="chuangmeng_table"></table>
</div>
</body>
</html>
<script src="${ctx}/static/admin/layui/layui.js"></script>
<script src="${ctx}/static/admin/js/common.js"></script>
<script type="text/html" id="toolbar">
<a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
</script>
<script type="text/html" id="search_sidebar_tpl">
<form class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label">合同编号</label>
<div class="layui-input-block">
<input type="text" name="nb" placeholder="请输入编号" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">姓名</label>
<div class="layui-input-block">
<input type="text" name="name" placeholder="请输入用户名" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">学历</label>
<div class="layui-input-block">
<input type="text" name="xueli" placeholder="请输入学历" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">等级</label>
<div class="layui-input-block">
<select name="lv">
<option value="">初级</option>
<option value="1">中级</option>
<option value="2">高级</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">项目组</label>
<div class="layui-input-block">
<input type="text" name="project" placeholder="请输入项目组" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">外包地点</label>
<div class="layui-input-block">
<input type="text" name="place" placeholder="请输入地址" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">拟入职时间</label>
<div class="layui-input-block">
<input type="text" name="time1" placeholder="请输入日期" autocomplete="off" class="layui-input shijian">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">入职时间</label>
<div class="layui-input-block">
<input type="text" name="time2" placeholder="请输入日期" autocomplete="off" class="layui-input shijian">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">转正时间</label>
<div class="layui-input-block">
<input type="text" name="time3" placeholder="请输入日期" autocomplete="off" class="layui-input shijian">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">状态</label>
<div class="layui-input-block">
<select name="status">
<option value="">全部</option>
<option value="0">在职</option>
<option value="1">离职</option>
</select>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="serach_form"><i class="layui-icon"></i> 搜索</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
</script>
<script type="text/javascript">
layui.use(['table','layer','jquery','element','sidebar','form','laytpl','laydate'], function(){
var $ = jQuery = layui.$;
var table = layui.table;
var layer = layui.layer;
var laytpl = layui.laytpl;
var element = layui.element;
var sidebar = layui.sidebar;
var form = layui.form;
var laydate=layui.laydate;
var tableIns = table.render({
elem: '#chuangmeng_table',
cellMinWidth: 80,
url: '${ctx}/sys/cmkj/getList',
height:'full-70',
page: true,
size: 'sm',
cols: [[
{type: 'numbers'},
{field: 'id', title: '序号'},
{field: 'nb', title: '合同编号'},
{field: 'name', title: '姓名'},
{field: 'idnb', title: '身份证号'},
{field: 'birthday', title: '出生日期'},
{field: 'xueli', title: '学历'},
{field: 'banknb', title: '银行卡号'},
{field: 'phone', title: '电话'},
{field: 'mail', title: '邮箱'},
{field: 'lv', title: '级别'},
{field: 'project', title: '项目组'},
{field: 'place', title: '外包地点'},
{field: 'time1', title: '拟入职时间'},
{field: 'time2', title: '入职时间'},
{field: 'time3', title: '转正时间'},
{field: 'time4', title: '合同时间'},
{field: 'money', title: '薪酬'},
{field: 'quanqin', title: '全勤'},
{field: 'butie', title: '补贴'},
{field: 'shebao', title: '社保'},
{field: 'status', title: '状态', templet: function(d){
if(d.status == 1){
return '在职';
}else{
return '离职';
}
}},
{title: '操作', width: 278, fixed: 'right', align:'center',toolbar: '#toolbar'}
]]
});
table.on('tool', function(obj){
var data = obj.data;
if(obj.event === 'edit'){
parent.layer.open({
type: 2,
area: ['700px', '450px'],
fixed: false, //不固定
maxmin: true,
content: '${ctx}/sys/cmkj/form?id='+data.id,
btn: ['保存', '关闭'],
yes: function(index, layero){
var iframeWin = layero.find('iframe')[0];//得到iframe页的窗口对象,执行iframe页的方法:
iframeWin.contentWindow.table = tableIns;
layero.find('iframe').contents().find('#submit-btn').click();
},
btn2: function(index, layero){
var index = layer.getFrameIndex(window.name);
layer.close(index); //再执行关闭
}
});
} else if(obj.event === 'del'){
parent.layer.confirm('确认删除?', {
btn: ['删除', '取消'] //可以无限个按钮
}, function(index, layero){
$.post("${ctx}/sys/cmkj/delete", {ids:data.id}, function(result){
if (result.success) {
parent.layer.open({
skin: 'layui-layer-success',
title: '提示',
content: '处理成功!',
yes: function(index, layero){
tableIns.reload({});
parent.layer.close(index);
},
cancel: function(){
tableIns.reload({});
}
});
} else {
parent.layer.open({
skin: 'layui-layer-error',
title: '提示',
content: result.msg
});
}
},"json");
}, function(index){
parent.layer.close(index);
});
}
});
$("#add").on('click', function() {
parent.layer.open({
type: 2,
area: ['700px', '450px'],
fixed: false, //不固定
maxmin: true,
content: '${ctx}/sys/cmkj/form',
btn: ['保存', '重置', '关闭'],
yes: function(index, layero){
var iframeWin = layero.find('iframe')[0];//得到iframe页的窗口对象,执行iframe页的方法:
iframeWin.contentWindow.table = tableIns;
layero.find('iframe').contents().find('#submit-btn').click();
},
btn2: function(index, layero){
layero.find('iframe').contents().find('#reset-btn').click();
return false;
},
btn3: function(index, layero){
var index = layer.getFrameIndex(window.name);
layer.close(index); //再执行关闭
}
});
});
var html = laytpl($('#search_sidebar_tpl').html()).render({});
$('#search_sidebar').on('click', function () {
var that = this;
sidebar.render({
elem: that,
content: html,
title: '搜索',
shade: false,
width: '30%', //可以设置百分比和px
done: function () {
laydate.render({
elem: '.shijian' //指定元素
});
form.render();
form.on('submit(serach_form)', function (data) {
table.reload('chuangmeng_table', {
method : 'post',
where: {
nb : data.field.nb,
name : data.field.name,
xueli : data.field.xueli,
lv : data.field.lv,
project : data.field.project,
place : data.field.place,
time1 : data.field.time1,
time2 : data.field.time2,
time3 : data.field.time3,
status : data.field.status
}
});
return false;
});
}
});
});
});
</script>
这里应注意获取列表的方法,如果表信息有中文要用post方法 不然会出现传参乱码的情况,从而获取不到想要的信息。
保存页面的代码:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>用户表单</title>
<link rel="stylesheet" href="${ctx}/static/admin/layui/css/layui.css">
</head>
<body>
<div class="layui-card-body">
<form class="layui-form layui-form-pane">
<input name="chuangmeng.id" type="hidden" value="${chuangmeng.id }" />
<div class="layui-form-item">
<label class="layui-form-label">合同编号</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.nb" lay-verify="required" placeholder="请输入合同编号" autocomplete="off" class="layui-input" value="${chuangmeng.nb }">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">姓名</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.name" lay-verify="required" placeholder="请输入用户姓名" autocomplete="off" class="layui-input" value="${chuangmeng.name }">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">身份证号</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.idnb" lay-verify="" placeholder="请输入身份证号" autocomplete="off" class="layui-input" value="${chuangmeng.idnb }">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">出生日期</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.birthday" lay-verify="" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input shijian" value="${chuangmeng.birthday}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">学历</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.xueli" lay-verify="" placeholder="请输入学历" autocomplete="off" class="layui-input" value="${chuangmeng.xueli}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">银行卡号</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.banknb" lay-verify="" placeholder="请输入银行卡号" autocomplete="off" class="layui-input" value="${chuangmeng.banknb }">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">电话</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.phone" lay-verify="" placeholder="请输入手机号" autocomplete="off" class="layui-input" value="${chuangmeng.phone}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">邮箱</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.mail" lay-verify="" placeholder="请输入邮箱" autocomplete="off" class="layui-input" value="${chuangmeng.mail}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">级别</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.lv" lay-verify="" placeholder="请输入等级" autocomplete="off" class="layui-input" value="${chuangmeng.lv}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">项目组</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.project" lay-verify="" placeholder="请输入项目组" autocomplete="off" class="layui-input" value="${chuangmeng.project}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">外包地点</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.place" lay-verify="" placeholder="请输入地址" autocomplete="off" class="layui-input" value="${chuangmeng.place}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">拟到职时间</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.time1" lay-verify="" placeholder="请输入日期" autocomplete="off" class="layui-input shijian" value="${chuangmeng.time1}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">入职时间</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.time2" lay-verify="" placeholder="请输入日期" autocomplete="off" class="layui-input shijian" value="${chuangmeng.time2}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">转正时间</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.time3" lay-verify="" placeholder="请输入日期" autocomplete="off" class="layui-input shijian" value="${chuangmeng.time3}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">合同时间</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.time4" lay-verify="" placeholder="请输入日期" autocomplete="off" class="layui-input shijian" value="${chuangmeng.time4}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">薪酬</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.money" lay-verify="" placeholder="请输入金额" autocomplete="off" class="layui-input" value="${chuangmeng.money}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">全勤奖</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.quanqin" lay-verify="" placeholder="请输入金额" autocomplete="off" class="layui-input" value="${chuangmeng.quanqin}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">补贴</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.butie" lay-verify="" placeholder="请输入金额" autocomplete="off" class="layui-input" value="${chuangmeng.butie}">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">社保</label>
<div class="layui-input-block">
<input type="text" name="chuangmeng.shebao" lay-verify="" placeholder="请输入金额" autocomplete="off" class="layui-input" value="${chuangmeng.shebao}">
</div>
</div>
<div class="layui-form-item" pane="">
<label class="layui-form-label">状态</label>
<div class="layui-input-block">
<input id="status1" type="radio" name="chuangmeng.status" value="1" title="在职" ${chuangmeng.status == 1?'checked':''}>
<input id="status2" type="radio" name="chuangmeng.status" value="0" title="离职" ${chuangmeng.status == 0?'checked':''}>
</div>
</div>
<div class="layui-form-item" style="display: none">
<div class="layui-input-block">
<button class="layui-btn" id="submit-btn" lay-submit>立即提交</button>
<button type="reset" id="reset-btn" class="layui-btn">重置</button>
</div>
</div>
</form>
</div>
</body>
</html>
<script src="${ctx}/static/admin/layui/layui.js"></script>
<script>
var table;
layui.use(['jquery','form','laydate'], function(){
var $ = jQuery = layui.$;
var form = layui.form;
var laydate=layui.laydate;
if ($(':input[name="chuangmeng.id"]').val().length > 0) {
$(':input[name="chuangmeng.name"]').attr('disabled','disabled');
}
laydate.render({
elem: '.shijian' //指定元素
});
//监听提交
form.on('submit', function(data){
$.post('${ctx}/sys/cmkj/save', data.field, function(result) {
if (result.success) {
table.reload({});
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index); //再执行关闭
} else {
layer.msg("保存失败!"+result.msg);
}
}, 'json');
return false;
});
});