技术博客 JFinal增删改查实践

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">&#xe615;</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;
  });
});

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值