博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
easyui的增删改
阅读量:4635 次
发布时间:2019-06-09

本文共 8456 字,大约阅读时间需要 28 分钟。

 

陈旧的开发模式

PM:“我要这个功能”
后端:“这个先找前端做个模板”
前端:“模板做完了”
后端:“我来对接一下,这里样式不对”
前端:“我改完了”
后端:“功能交付”
PM:“春节要加这个活动”
后端:“这个先找前端改个模板”
前端:“模板做完了”
后端:“我来对接一下,这里样式不对”
前端:“我改完了”
后端:“功能交付”

 

美工(ui工程师:出一个项目模型)

java工程师:将原有的html转成jsp,动态展示数据
缺点:
客户需要调节前端的展示效果
解决:由美工去重新排版,重新选色。

 

前后端分离

PM:“我要这个功能”
前端:“我要接口”
后端:“接口完成了”
前端:“我来对接一下,功能交付”
PM:“春节要加这个活动”
前端:“需要增加接口”
后端:“接口完成了”
前端:“我来对接一下,功能交付”

优点:

美工、java工程师都是独立工作的,彼此之间在开发过程中是没有任何交际。

在开发前约定数据交互的格式。
java工程师的工作:写方法返回数据如tree_data1.json
美工:只管展示tree_data1.json

前端有且仅有静态内容,再明确些,只有HTML/CSS/JS。

后端可以用任何语言;遵循一个原则:只提供数据,不提供任何和界面表现有关的内容;统一API接口,接口完全可以共用。

减少后端服务器的兵法压力,除了接口以外的其他所有http请求全部转移到前端服务器上

页面不再是全部刷新,而是异步加载,局部刷新,减轻压力

案例:

我们要使用easyui的三个布局

1、datagrid布局

2、dialog布局
3、form布局

操作表

 

SerialNo是自增列

前端代码:

Insert title here

  js:

$(function() {	$('#dg').datagrid({		url : $("#txc").val()+'/userAction.action?methodName=list',		fitColumns : true,		fit : true,		pagination : true,		columns : [ [ {			field : 'uid',			title : '代码',			width : 100		}, {			field : 'uname',			title : '名称',			width : 100		}, {			field : 'upwd',			title : '价格',			width : 100,			align : 'right'		} ] ],		toolbar : [ {			iconCls : 'icon-edit',			handler : function() {							var row = $('#dg').datagrid('getSelected');								if(row){					$('#ff').form('load', row);					$('#dd').dialog('open');					$('#xm').html('编辑');					$('#xm').attr("data","edit");				}														}		}, '-', {			iconCls : 'icon-add',			handler : function() {				$('#ff').form('clear');				$('#dd').dialog('open');				$('#xm').attr("data","add");			}		}, '-', {			iconCls : 'icon-remove',			handler : function() {			var data=$('#dg').datagrid('getSelected');			console.log( $("#txc").val()+'/userAction.action?methodName=remove&SerialNo='+data.SerialNo);				$.ajax({					url : $("#txc").val()+'/userAction.action?methodName=remove&SerialNo='+data.SerialNo,					success: function(param){    						$('#dg').datagrid('reload');					    						    }    				})												}		} ]	});})function ok(obj){	$('#ff').form('submit', {   			    url:'../userAction.action?methodName='+$("#xm").attr("data"),    	    success: function(param){    	    	$('#dd').dialog('close');	    	$('#dg').datagrid('reload');	    	$('#ff').form('clear');	    }    	});  } 

前后端的规则tree_data1.json

{"total":28,"rows":[	{"uid":"FI-SW-01","uname":"Koi","upwd":10.00,"status":"P","listprice":36.50,"attr1":"Large","itemid":"EST-1"},	{"uid":"K9-DL-01","uname":"Dalmation","upwd":12.00,"status":"P","listprice":18.50,"attr1":"Spotted Adult Female","itemid":"EST-10"},	{"uid":"RP-SN-01","uname":"Rattlesnake","upwd":12.00,"status":"P","listprice":38.50,"attr1":"Venomless","itemid":"EST-11"},	{"uid":"RP-SN-01","uname":"Rattlesnake","upwd":12.00,"status":"P","listprice":26.50,"attr1":"Rattleless","itemid":"EST-12"},	{"uid":"RP-LI-02","uname":"Iguana","upwd":12.00,"status":"P","listprice":35.50,"attr1":"Green Adult","itemid":"EST-13"},	{"uid":"FL-DSH-01","uname":"Manx","upwd":12.00,"status":"P","listprice":158.50,"attr1":"Tailless","itemid":"EST-14"},	{"uid":"FL-DSH-01","uname":"Manx","upwd":12.00,"status":"P","listprice":83.50,"attr1":"With tail","itemid":"EST-15"},	{"uid":"FL-DLH-02","uname":"Persian","upwd":12.00,"status":"P","listprice":23.50,"attr1":"Adult Female","itemid":"EST-16"},	{"uid":"FL-DLH-02","uname":"Persian","upwd":12.00,"status":"P","listprice":89.50,"attr1":"Adult Male","itemid":"EST-17"},	{"uid":"AV-CB-01","uname":"Amazon Parrot","upwd":92.00,"status":"P","listprice":63.50,"attr1":"Adult Male","itemid":"EST-18"}]}

  后台代码:

package com.chenjiahao.dao;import java.util.List;import java.util.Map;import com.chenjiahao.util.JsonBaseDao;import com.chenjiahao.util.JsonUtils;import com.chenjiahao.util.PageBean;import com.chenjiahao.util.StringUtils;public class UserDao extends JsonBaseDao {	/**	 * 登录查询用户表	 * 	 * @param map	 * @param pageBean	 * @return	 * @throws Exception	 */	public List
> list(Map
map, PageBean pageBean) throws Exception { String sql = "SELECT *FROM t_easyui_user_version2 WHERE TRUE"; String uid = JsonUtils.getParamVal(map, "uid"); String upwd = JsonUtils.getParamVal(map, "upwd"); if (StringUtils.isNotBlank(uid)) { sql = sql + " and uid=" + uid; } if (StringUtils.isNotBlank(upwd)) { sql = sql + " and upwd=" + upwd; } return super.executeQuery(sql, null); } /** * 通过中间表查询登录用户所对应的权限 * * @param string * @param pageBean * @return * @throws Exception */ public List
> listMenu(String uid, PageBean pageBean) throws Exception { String sql = "SELECT*FROM t_easyui_usermenu WHERE TRUE"; if (StringUtils.isNotBlank(uid)) { sql = sql + " and uid=" + uid; } return super.executeQuery(sql, null); } /** * 编辑用户信息 * * @param paMap * @return * @throws Exception */ public int edit(Map
paMap) throws Exception { String sql = "update t_easyui_user_version2 set uid=?,uname=?,upwd=? where serialno=?"; return super.executeUpdate(sql, new String[] { "uid", "uname", "upwd", "SerialNo" }, paMap); } /** * 新增用户信息 * * @param paMap * @return * @throws Exception */ public int add(Map
paMap) throws Exception { String sql = "INSERT INTO t_easyui_user_version2(uid, uname, upwd) VALUES(?,?,?)"; return super.executeUpdate(sql, new String[] { "uid", "uname", "upwd" }, paMap); } /** * 删除用户信息 * * @param paMap * @return * @throws Exception */ public int remove(Map
paMap) throws Exception { String sql = "DELETE FROM t_easyui_user_version2 WHERE SerialNo=?"; return super.executeUpdate(sql, new String[] { "SerialNo" }, paMap); }}

  处理请求页面

package com.chenjiahao.web;import java.util.HashMap;import java.util.List;import java.util.Map;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.apache.tomcat.jni.OS;import com.chenjiahao.dao.UserDao;import com.chenjiahao.util.PageBean;import com.chenjiahao.util.ResponseUtil;import com.fasterxml.jackson.databind.ObjectMapper;import com.zking.framework.ActionSupport;public class UserAction extends ActionSupport {	private UserDao userDao = new UserDao();	/**	 * @param request	 * @param response	 * @return	 * @throws Exception	 */	public String login(HttpServletRequest request, HttpServletResponse response) throws Exception {		List
> list = this.userDao.list(request.getParameterMap(), null); if (list != null && list.size() > 0) { List
> listMenu = this.userDao.listMenu(request.getParameter("uid"), null); StringBuilder sb = new StringBuilder(); for (Map
map : listMenu) { sb.append("," + map.get("menuId")); } request.setAttribute("menuHid", sb.substring(1)); } else { return "login"; } return "index"; } /** * datagrid所需数据 * * @param request * @param response * @return * @throws Exception */ public String list(HttpServletRequest request, HttpServletResponse response) throws Exception { PageBean pageBean = new PageBean(); pageBean.setRequest(request); List
> list = this.userDao.list(request.getParameterMap(), pageBean); ObjectMapper om = new ObjectMapper(); Map
map = new HashMap<>(); map.put("total", pageBean.getTotal()); map.put("rows", list); ResponseUtil.write(response, om.writeValueAsString(map)); return null; } /** * form组件提交所需数据 * * @param request * @param response * @return * @throws Exception */ public String edit(HttpServletRequest request, HttpServletResponse response) throws Exception { int edit = this.userDao.edit(request.getParameterMap()); ObjectMapper om = new ObjectMapper(); ResponseUtil.write(response, om.writeValueAsString(edit)); return null; } public String add(HttpServletRequest request, HttpServletResponse response) throws Exception { int add = this.userDao.add(request.getParameterMap()); ObjectMapper om = new ObjectMapper(); ResponseUtil.write(response, om.writeValueAsString(add)); return null; } public String remove(HttpServletRequest request, HttpServletResponse response) throws Exception { int remove = this.userDao.remove(request.getParameterMap()); ObjectMapper om = new ObjectMapper(); ResponseUtil.write(response, om.writeValueAsString(remove)); return null; }}

  效果:

 

进行增,删,改时会有数据回访。

 

转载于:https://www.cnblogs.com/chenjiahao9527/p/11022664.html

你可能感兴趣的文章
Eclipse中部分快捷键
查看>>
LintCode: Unique Characters
查看>>
从一个OutOfMemoryError 学会了分析Java内存泄漏问题
查看>>
Delphi TScrollBar 用于滚动窗口、组件内容
查看>>
【微信开发】上传下载多媒体文件
查看>>
java道路级别
查看>>
扩展方法
查看>>
vue事件
查看>>
Docker在Ubuntu16.04上安装
查看>>
python爬虫学习之页面登陆
查看>>
SPOJ-OPTM Optimal Marks ★★(按位建图 && 最小割)
查看>>
H264/AVC视频解码时AVC1和H264的区别
查看>>
SRAM与SDRAM的区别
查看>>
如何不使用pthread_cancel而杀死线程
查看>>
[笔记]VI编辑器的学习
查看>>
过滤器与拦截器区别
查看>>
USACO 1.5.4 Checker Challenge
查看>>
第二阶段站立会议7
查看>>
[18]Debian Linux Install GNU GCC Compiler and Development Environment
查看>>
12种排序算法
查看>>