jfinal结合easyui完成基本的增删改查操作

来源:互联网 发布:linux dns配置文件view 编辑:程序博客网 时间:2024/05/17 22:29
jfinal结合easyui完成增删改查操作

    创建jfinal项目,具体不多说,下面会放出源码。请结合jfinal官网创建一个jfinal项目,加深印象。

    什么是jfinal?JFinal 是基于Java 语言的极速 web 开发框架。

    重点在于easyui的分页下面贴出部分代码

   public void userList(){   String sql = "from user order by id desc";   Page<User> paginate = User.dao.paginate(getParaToInt("page"), getParaToInt("rows"),"select *",sql);   Map map = new HashMap();     map.put("rows", paginate.getList());     map.put("total", paginate.getTotalRow());   System.out.println(map);   renderJson(map);   }
   使用的jfinal自带的分页只要按照easyui的固定格式返回就可以了。

   添加很简单获取页面的model,执行save()方法就可以。

  public void addUser(){   User user = getModel(User.class, "u");   user.save();   redirect("/");      }
  删除类似不在详细赘述。

  编辑某个用户的信息很简单,使用findFirst()方法。

 public void editUser(){   String sql = "select * from user where id = ?";       setAttr("user",User.dao.findFirst(sql,getPara(0)));       renderTemplate("userForm.html");   }
  renderTemplate这个是jfinal自带的模板标签,当然你也可以使用FreeMarker,Beetl等。前台使用#(user.id)输出就可以。

  前台的代码,跟着手册敲得。

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>用户管理</title>    <link rel="stylesheet" type="text/css" href="#(ctx)/jquery-easyui-1.4.3/themes/metro-blue/easyui.css"><link rel="stylesheet" type="text/css" href="#(ctx)/jquery-easyui-1.4.3/themes/icon.css"><script type="text/javascript" src="#(ctx)/jquery-easyui-1.4.3/jquery.min.js"></script><script type="text/javascript" src="#(ctx)/jquery-easyui-1.4.3/jquery.easyui.min.js"></script><script type="text/javascript" src="#(ctx)/jquery-easyui-1.4.3/locale/easyui-lang-zh_CN.js"></script><style> </style></head><body><div id="tb"><a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="addUser()">添加</a><a href="#" class="easyui-linkbutton" iconCls="icon-cut" plain="true" onclick="deleteUser()">删除</a><a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">修改</a></div> <table id="dg" toolbar="#tb" title="用户列表"></table> <div id="dd" class="easyui-dialog" title="添加用户" closed="true" style="width:300px;height:195px;"><form action="#(ctx)/addUser" style="padding:10px 20px 10px 40px;">    <table>      <tr>        <td>编号</td><td><input class="easyui-textbox"  name="u.id"></td>      </tr>      <tr>        <td>用户名</td><td><input class="easyui-textbox" name="u.userId"></td>      </tr>      <tr>        <td>内容</td><td><input class="easyui-textbox" name="u.content"></td>      </tr>      <tr>        <td>时间</td><td><input   type="text" id="txtDate"class="easyui-datebox" name="u.createTime"></td>      </tr>       <tr>        <td colspan="1"></td><td><input type="submit" value="提交"><input type="reset" value="重置"></td>      </tr>        </table></form></div></body><script>$(function() {$("#txtDate").datebox();$('#dg').datagrid({url : '#(ctx)/userList',pagination : true,pageSize : 5,pageNumber : 1,pageList : [ 5, 10, 15 ],width : 500,singleSelect : true,columns : [ [ {field : 'id',title : "编号",width : 100}, {field : 'userId',title : "用户名",width : 100}, {field : 'content',title : "内容",width : 100}, {field : 'createTime',title : "时间",width : 100} ] ]});});function deleteUser() {var row = $('#dg').datagrid('getSelected');if (row) {parent.$.messager.confirm('温馨提示', '删除后无法恢复您确定要删除?', function() {$.ajax({type : 'get',url : "#(ctx)/deleteUser/" + row.id,success : function() {$('#dg').datagrid();}});})} else {$.messager.alert("温馨提示", "请选择您要删除的数据!");}}function editUser() {var row = $('#dg').datagrid('getSelected');if (row) {$("#dd").dialog({title : "修改用户信息",width : 300,height : 195,closed : false,cache : false,href : "#(ctx)/editUser/" + row.id,modal : true});} else {$.messager.alert("温馨提示", "请选择您要修改的数据!");}}function addUser() {$('#dd').dialog('open');}</script></html>
  好了使用jfinal完成增删改查的例子完成,我也是初学者代码可能不够规范,另外没有加表单验证,只是把基本的原理过一遍。

  随后我会把源码贴到github。有需要的可以参考下。