- 浏览: 2678224 次
- 性别:
- 来自: 成都
-
文章分类
最新评论
-
我素熊猫:
66666666666666
java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoaderL -
jonyzhou94:
1987_ming 写道1987_ming 写道System. ...
CXF框架入门实例 -
davidforit:
你那个“2004年Nutch创始人Doug Cutting基于 ...
《Hadoop基础教程》之初识Hadoop -
masuweng:
我的就是这么弄得,到了页面还是那个格式的 。
JSONObject转换JSON--将Date转换为指定格式 -
masuweng:
∑
JSONObject转换JSON--将Date转换为指定格式
前几天心血来潮用jquery-easyui+spring、struts2、hibernate实现了一个系统的一小部分功能,下面给大家分享一下。
- 首先看运行效果:
【图一:登录页】
【图二:页面布局】
【图三:用户编辑层】
【图四:确认弹出框】
- 准备
easyui插件简介在这就不赘述了,大家可以在iteye上找到很多该插件的相关消息。
如果页面需要使用easyui插件,需要引进一下js和css(使用的时候需要注意easyui版本依赖的jquery.js版本要对应):
<script type="text/javascript" src="<%=root%>/Web/common/js/jquery-1.4.4.min.js"></script>
<link rel="stylesheet" type="text/css" href="<%=root%>/Web/common/js/easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="<%=root%>/Web/common/js/easyui/themes/icon.css"> <script type="text/javascript" src="<%=root%>/Web/common/js/easyui/js/jquery.easyui.min.js"></script> <script type="text/javascript" src="<%=root%>/Web/common/js/easyui/js/easyui-lang-zh_CN.js"></script>
- 布局
为了让一个主页实现上下左右中的布局方式显示,这里就需要用到easyui一个叫layout的东西,通常有多种方式可以实现布局。
①使用js创建layout
首先定义一个div,设置region,title等属性(注html是没有region属性的,这是easyui专属属性)
<div id="cc" style="width:600px;height:400px;"> <div region="north" title="North Title" split="true" style="height:100px;"></div> <div region="south" title="South Title" split="true" style="height:100px;"></div> <div region="east" iconCls="icon-reload" title="East" split="true" style="width:100px;"></div> <div region="west" split="true" title="West" style="width:100px;"></div> <div region="center" title="center title" style="padding:5px;background:#eee;"></div> </div>
然后在js中指定id为cc的div为layout:
$('#cc').layout(options);
简单介绍几个layout属性:
属性名 | 数据类型 | 功能 | 默认值 |
title | string | 指定布局的标题名称 | 无 |
region | string | 指定布局位置,分:东、西、南、北、中 | |
border | boolean | 是否显示边界 | true |
split | boolean | 是否显示分界线从而用户可以拖动改变其大小 | false |
iconCls | string | 指定布局的图标样式 | 无 |
href | string | 指定该布局远程调用的html路径 | 无 |
②让整个body使用easyui的cssclass:class="easyui-layout"自动创建layout
这也是我使用的方式,看下面代码:
<body class="easyui-layout"> <!-- 正上方panel --> <div region="north" style="height:100px;padding:10px;" href="<%=root%>/Web/common/page/top.html"></div> <!-- 正左边panel --> <div region="west" title="菜单栏" split="true" style="width:280px;padding1:1px;overflow:hidden;"> <div class="easyui-accordion" fit="true" border="false"> <!-- selected --> <div title="用户权限管理" selected="true"> <ul> <li><a href="javascript:addTab('tabId_loginInfo','用户管理','<%=root%>/ospm/loginInfo/goLoginInfoMain.jhtml');">用户管理</a></li> <li><a href="javascript:addTab('tabId_privilege','权限管理','<%=root%>/ospm/loginInfo/goPrivilegeMain.jhtml');">权限管理</a></li> </ul> </div> </div> </div> <!-- 正中间panel --> <div region="center" title="功能区" > <div class="easyui-tabs" id="centerTab" fit="true" border="false"> <div title="欢迎页" style="padding:20px;overflow:hidden;"> <div style="margin-top:20px;"> <h3>你好,欢迎来到权限管理系统</h3> </div> </div> </div> </div> <!-- 正下方panel --> <div region="south" style="height:50px;" align="center"> <label> 作者:白糖<br/> 时间:2011-5-17 </label> </div> </body>
运行效果如【图二:页面布局】
- 创建选项卡
【图二:页面布局】上面标记了在菜单栏点击“用户管理”链接即可在功能区创建一个叫“用户管理”的选项卡并加载相应数据。注意:用户管理页面是另一个jsp,需要远程调用。
最初我使用tabs的href属性来远程调用用户管理jsp,发现页面会有js冲突,导致用户管理页面的添加、编辑等各种功能失效,我猜想可能是js冲突,因为布局页引用了easyui,而用户管理jsp也引用了同样的easyui。
后来看了下项目经理ext的布局代码,原来在点击链接的时候会创建一个tabs,只是tabs的内容是一个iframe分隔:
/** * 创建新选项卡 * @param tabId 选项卡id * @param title 选项卡标题 * @param url 选项卡远程调用路径 */ function addTab(tabId,title,url){ //如果当前id的tab不存在则创建一个tab if($("#"+tabId).html()==null){ var name = 'iframe_'+tabId; $('#centerTab').tabs('add',{ title: title, closable:true, cache : false, //注:使用iframe即可防止同一个页面出现js和css冲突的问题 content : '<iframe name="'+name+'"id="'+tabId+'"src="'+url+'" width="100%" height="100%" frameborder="0" scrolling="auto" ></iframe>' }); } }
不过群里也有些大神提醒:如果大量使用iframe会使页面性能降低,所以使用iframe分隔tabs只适合小型项目使用。
- datagrid表格
easyui datagrid是争议最大的一个功能插件,很多人说它不开源,提供的api不全面,标题列内容可能不对齐,操作繁杂等等。其实个人觉得这个table的功能已经相当不错了,如果只需要做基本的显示则只需配很少的代码。
下面简单介绍下datagrid的使用:
①首先肯定需要有一个table标签,给它定义一个id,在js中通过id.datagrid方法即可创建表格
<table id="tt"></table>
$('#tt').datagrid(options);
②创建表格的列名有两种方式:第一种是直接在table标签中定义,第二种是在js中定义:
我使用的是第一种方式:
<!-- 表格 --> <table id="loginInfoTable" title="用户信息一览" border="0" cellspacing="0" cellpadding="0" iconCls="icon-edit" width="98%" idField="loginId" pagination="true" remoteSort="false" singleSelect="false" showFooter="false" striped="true" url="<%=root%>/ospm/loginInfo/doLoginInfoSearch.jhtml"> <thead> <tr align="center"> <th field="ck" width="20" checkbox="true" width="20"></th> <th field="loginCode" width="200">用户名</th> <th field="statuValue" width="100">状态</th> <th field="opt" formatter='optFormater' width="150">操作</th> </tr> </thead> </table>
第二种方式如下:
columns:[[ {field:'itemid',title:'Item ID',rowspan:2,width:80,sortable:true}, {field:'productid',title:'Product ID',rowspan:2,width:80,sortable:true}, {title:'Item Details',colspan:4} ],[ {field:'listprice',title:'List Price',width:80,align:'right',sortable:true}, {field:'unitcost',title:'Unit Cost',width:80,align:'right',sortable:true}, {field:'attr1',title:'Attribute',width:100}, {field:'status',title:'Status',width:60} ]]
③向后台请求数据
datagrid有一个属性叫url,在进入页面后,它会通过ajax方式向后台发送请求,后台封装相应数据(JSON格式)再返回给前台即可显示。注意:datagrid在回调函数中必须获得两项json数据:total表示查询出的总结过,rows表示显示在table中的数据集合。
/** * 封装Json数据 */ long total = 0; // 符合查询的总条数 List<LoginInfoTableDto> lstTable = null; // 查询结果 total = (Long) mapLoginInfo.get(Constant4Ospm.TOTAL); if (mapLoginInfo.get(Constant4Ospm.SEARCH_RESULT) != null) { lstTable = (List<LoginInfoTableDto>) mapLoginInfo .get(Constant4Ospm.SEARCH_RESULT); } else { //注:如果从数据库查询不出数据,也必须封装一个空的json集合,不然页面就会报js错误 lstTable = new ArrayList<LoginInfoTableDto>(); } JSONObject datas = new JSONObject(); // 设置总共有多少条记录 datas.put(Constant4Ospm.TOTAL, total); // 设置当前页的数据 datas.put(Constant4Ospm.PAGE_SIZE, lstTable);
④后台数据与表格关联
后台过来的数据怎么与表格每一列对应呢?其实很简单:后台rows中包含了名叫LoginInfoTableDto的javabean-json集合,datagrid的field和idField对应LoginInfoTableDto中的一个属性(大体上是这样,当然field也可以不对应javabean的属性,你可以进行一些转换)。
⑤toolbar工具栏
【图二:页面布局】能够看到datagrid有“添加新用户”、“批量删除”等工具栏,这些工具栏的实现方式也很简单:
$('#loginInfoTable').datagrid({ toolbar:[{//正上方工具栏 text:'添加新用户', iconCls:'icon-add', handler:function(){ //点击工具栏运行的js方法 openDialog_add(); } },'-',{ text:'批量删除', iconCls:'icon-cancel', handler:function(){ batch('delete'); } ...............
当然easyui datagrid还有很多其它的功能,网上有很多大神已经详细介绍过,这里就不赘述了。
- dialog
对话框的使用也很简单:你只需要定义一个带id的div,在div中填入你需要在对话框中显示的内容,然后调用一下方法即可变成easyui的dialog:
<div id="dd" title="My Dialog" style="width:400px;height:200px;"> Dialog Content. </div>
$('#dd').dialog(options);
前面【图三:用户编辑层】就是一个dialog,大家看下代码:
jsp页面:
<!-- 编辑 --> <div id="loginInfoEdit" icon="icon-save" style="padding: 5px; width: 500px; height: 300px;"> <h5 id="loginInfoEdit_message" style="color: red;"></h5> <div class="ToolTip_Form" id="table_loginInfoEdit" onkeydown="if(event.keyCode==13){loginInfoEdit();}"> <input type="hidden" id="loginInfoEdit_loginId"></input> <ul> <li> <label>用户名:</label> <label id="loginInfoEdit_loginCode"></label> </li> <li> <label>密码:</label> <input type="password" class="easyui-validatebox" id="loginInfoEdit_password" maxlength="20" required="true"></input> </li> <li> <label>重复密码:</label> <input type="password" class="easyui-validatebox" id="loginInfoEdit_repassword" maxlength="20" required="true"></input> </li> <li> <a href="#" class="easyui-linkbutton" icon="icon-ok" onclick="loginInfoEdit();">提交</a> </li> </ul> </div> </div>
js代码:
//设置弹出框的属性 function setDialog_edit(){ $('#loginInfoEdit').dialog({ title : '用户编辑', modal: true, //模式窗口:窗口背景不可操作 collapsible : true, //可折叠,点击窗口右上角折叠图标将内容折叠起来 resizable : true //可拖动边框大小 }); } //打开对话框 function openDialog_edit(loginId,loginCode){ loginInfoEditReset(loginId,loginCode); $('#loginInfoEdit').dialog('open'); } //关闭对话框 function closeDialog_edit(){ $('#loginInfoEdit').dialog('close'); }
- messager消息框
【图四:确认弹出框】就是一个消息框,easyui它可以模仿html的alert()、confirm()等提示框,而且画面更美观。
图四批量禁用的代码如下:
//禁用操作 $.messager.confirm('禁用提示', '你确定禁用下列用户吗?<br/>'+cods.join(','), function(r){ if (r){ var url = root+'/ospm/loginInfo/doLoginInfoInvalid.jhtml?loginId='+loginId; changeStatus(url); } });
很抱歉,只完成了用户管理一个模块的功能。
附件带项目源码,希望对大家有所帮助。(源码一包含项目源码和数据库,源码二包含项目jar包)
关键jar版本:hibernate3.3、spring2.6、struts2.1
数据库:mysql5.1
数据库连接池:bonecp 0.7
项目类型:eclipse - dynamic web project
登录帐号:admin 密码:admin
部署方式:
①下载“源码一”和“源码二”,然后分别解压
②源码一包含项目源码和部分jar包以及*.sql;源码二包含其余jar包,直接放入OSPM\WebRoot\WEB-INF\lib目录下即可
③使用eclipse打开,import导入项目
④修改OSPM/config/mysql-jdbc.properties数据库连接帐号密码
⑤使用eclipse自带插件:servers部署启动项目
⑥访问http://localhost:8080/OSPM即可
需要注意的是,这个项目是eclipse下创建的dynamic web project不是tomcat项目
另一种方案:
完成上面①~④步骤以后把项目export成war包,直接放到tomcat的webapps下然后启动
评论
百度网盘地址:http://pan.baidu.com/s/1bEwTwa 密码:jm1w
jQuery EasyUI简称jeasyui,也就叫easyui,是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,也不需要对css样式有深入的了解,开发者需要了解的只有一些简单的html标签。
课程大纲
一、理论讲解部分:
1.jquery2.x语言新特性 - 介绍jquery2.x中的新特征
2.jquery2.x语言新特性 - 使用Google CDN
3.jquery2.x中的选择器 - 基本选择器
4.jquery2.x中的选择器 - 层次选择器
5.jquery2.x中的选择器 - 层次选择器
6.jquery2.x中的选择器 - 表单选择器
7.jquery2.x中的核心功能 - 核心函数
8.jquery2.x中的核心功能 - jQuery方法
9.jquery2.x中的ajax - jquery中ajax方法
10.jquery2.x中的ajax - ajax实现表单验证
11.jquery2.x中的ajax - ajax实现自动补全功能
12.jquery2.x中的动画效果 - 动画效果实现函数介绍
13.jquery2.x中的动画效果 - 动画效果实现函数介绍
14.jquery2.x中的动画效果 - 动画效果示例
15.jquery2.x第三方插件应用 - 用插件及新插件介绍
16.jquery easyUI核心API详解 - query easyUI简介
17.jquery easyUI核心API详解 - jquery easyUI中的window对象
18.jquery easyUI组件详解 - 基本组件的使用
19.jquery easyUI组件详解 - 布局组件的使用
20.jquery easyUI组件详解 - 表单组件的使用
21.jquery easyUI综合示例 - 表单验证
22.jquery easyUI综合示例 - 复杂页面布局
23.jquery easyUI综合示例 - 复杂页面布局
24.jquery easyUI综合示例 - 示例-制作课程表
25.jquery easyUI+dwr+ssh整合 - dwr的介绍
26.jquery easyUI+dwr+ssh整合 - 整合综合示例
二、项目实战部分:
Struts2+Spring3+Hibernate4+DWR+jquery2.x+easyUI1.3.x实战[我的租房网]
1.ssh+jquery+dwr+easyUI实战租房网 - SSH整合
2.ssh+jquery+dwr+easyUI实战租房网 - 登录显示列表
3.ssh+jquery+dwr+easyUI实战租房网 - easyui页面框架布局
4.ssh+jquery+dwr+easyUI实战租房网 - 用户注册
5.ssh+jquery+dwr+easyUI实战租房网 - 主页面tab的使用(I)
6.ssh+jquery+dwr+easyUI实战租房网 - 主页面tab的使用(II)
7.ssh+jquery+dwr+easyUI实战租房网 - 租房列表DataGrid分页显示(I)
8.ssh+jquery+dwr+easyUI实战租房网 - 租房列表DataGrid分页显示(II)
9.ssh+jquery+dwr+easyUI实战租房网 - 租房列表查询(I)
10.ssh+jquery+dwr+easyUI实战租房网 - 租房列表查询(II)
11.ssh+jquery+dwr+easyUI实战租房网 - 添加房屋(I)
12.ssh+jquery+dwr+easyUI实战租房网 - 添加房屋(II)
13.ssh+jquery+dwr+easyUI实战租房网 - 删除房屋
14.ssh+jquery+dwr+easyUI实战租房网 - 修改房屋
15.ssh+jquery+dwr+easyUI实战租房网 - 完善&总结

以前下的很多别的demo都打不开。





首先,这个实体类不是我写的,如果数据库几百张表像这样写肯定要写死的,我是通过Eclipse Hibernate映射插件直接生成的。
好处很多,这个在你以后开发会慢慢领悟,我举一个最简单的例子:我想写依据LoginInfo的Hql查询语句,我会这样写:
String hql = "SELECT * FROM "+LoginInfo.REF+" l WHERE l."+LoginInfo.PROP_LOGIN_CODE +"=?",我把每个table和字段都定义成一个常量,这样就避免了硬编码的问题。
登录这段代码的意思是:查询帐号、密码和状态与map中的值对应的结果。
package com.bless.ospm.model.base; import java.io.Serializable; /** * This is an object that contains data related to the login_info table. * Do not modify this class because it will be overwritten if the configuration file * related to this class is modified. * * @hibernate.class * table="login_info" */ public abstract class BaseLoginInfo implements Serializable { private static final long serialVersionUID = -1290159826307427542L; public static String REF = "LoginInfo"; public static String PROP_STATUS = "status"; public static String PROP_CODE_NO = "codeNo"; public static String PROP_LOGIN_CODE = "loginCode"; public static String PROP_PASSWORD = "password"; public static String PROP_ID = "id"; // constructors public BaseLoginInfo () { initialize(); } /** * Constructor for primary key */ public BaseLoginInfo (java.lang.Integer id) { this.setId(id); initialize(); } /** * Constructor for required fields */ public BaseLoginInfo ( java.lang.Integer id, java.lang.String loginCode, java.lang.String password, java.lang.Integer status) { this.setId(id); this.setLoginCode(loginCode); this.setPassword(password); this.setStatus(status); initialize(); } public BaseLoginInfo(Integer id, String loginCode, Integer status) { super(); this.id = id; this.loginCode = loginCode; this.status = status; } protected void initialize () {} private int hashCode = Integer.MIN_VALUE; // primary key private java.lang.Integer id; // fields private java.lang.String codeNo; private java.lang.String loginCode; private java.lang.String password; private java.lang.Integer status; // collections private java.util.Set<com.bless.ospm.model.LoginXRole> loginXRoles; private java.util.Set<com.bless.ospm.model.LoginXOrg> loginXOrgs; private java.util.Set<com.bless.ospm.model.LoginXPriv> loginXPrivs; /** * Return the unique identifier of this class * @hibernate.id * generator-class="native" * column="id" */ public java.lang.Integer getId () { return id; } /** * Set the unique identifier of this class * @param id the new ID */ public void setId (java.lang.Integer id) { this.id = id; this.hashCode = Integer.MIN_VALUE; } /** * Return the value associated with the column: code_no */ public java.lang.String getCodeNo () { return codeNo; } /** * Set the value related to the column: code_no * @param codeNo the code_no value */ public void setCodeNo (java.lang.String codeNo) { this.codeNo = codeNo; } /** * Return the value associated with the column: login_code */ public java.lang.String getLoginCode () { return loginCode; } /** * Set the value related to the column: login_code * @param loginCode the login_code value */ public void setLoginCode (java.lang.String loginCode) { this.loginCode = loginCode; } /** * Return the value associated with the column: password */ public java.lang.String getPassword () { return password; } /** * Set the value related to the column: password * @param password the password value */ public void setPassword (java.lang.String password) { this.password = password; } /** * Return the value associated with the column: status */ public java.lang.Integer getStatus () { return status; } /** * Set the value related to the column: status * @param status the status value */ public void setStatus (java.lang.Integer status) { this.status = status; } /** * Return the value associated with the column: loginXRoles */ public java.util.Set<com.bless.ospm.model.LoginXRole> getLoginXRoles () { return loginXRoles; } /** * Set the value related to the column: loginXRoles * @param loginXRoles the loginXRoles value */ public void setLoginXRoles (java.util.Set<com.bless.ospm.model.LoginXRole> loginXRoles) { this.loginXRoles = loginXRoles; } public void addTologinXRoles (com.bless.ospm.model.LoginXRole loginXRole) { if (null == getLoginXRoles()) setLoginXRoles(new java.util.TreeSet<com.bless.ospm.model.LoginXRole>()); getLoginXRoles().add(loginXRole); } /** * Return the value associated with the column: loginXOrgs */ public java.util.Set<com.bless.ospm.model.LoginXOrg> getLoginXOrgs () { return loginXOrgs; } /** * Set the value related to the column: loginXOrgs * @param loginXOrgs the loginXOrgs value */ public void setLoginXOrgs (java.util.Set<com.bless.ospm.model.LoginXOrg> loginXOrgs) { this.loginXOrgs = loginXOrgs; } public void addTologinXOrgs (com.bless.ospm.model.LoginXOrg loginXOrg) { if (null == getLoginXOrgs()) setLoginXOrgs(new java.util.TreeSet<com.bless.ospm.model.LoginXOrg>()); getLoginXOrgs().add(loginXOrg); } /** * Return the value associated with the column: loginXPrivs */ public java.util.Set<com.bless.ospm.model.LoginXPriv> getLoginXPrivs () { return loginXPrivs; } /** * Set the value related to the column: loginXPrivs * @param loginXPrivs the loginXPrivs value */ public void setLoginXPrivs (java.util.Set<com.bless.ospm.model.LoginXPriv> loginXPrivs) { this.loginXPrivs = loginXPrivs; } public void addTologinXPrivs (com.bless.ospm.model.LoginXPriv loginXPriv) { if (null == getLoginXPrivs()) setLoginXPrivs(new java.util.TreeSet<com.bless.ospm.model.LoginXPriv>()); getLoginXPrivs().add(loginXPriv); } public boolean equals (Object obj) { if (null == obj) return false; if (!(obj instanceof com.bless.ospm.model.LoginInfo)) return false; else { com.bless.ospm.model.LoginInfo loginInfo = (com.bless.ospm.model.LoginInfo) obj; if (null == this.getId() || null == loginInfo.getId()) return false; else return (this.getId().equals(loginInfo.getId())); } } public int hashCode () { if (Integer.MIN_VALUE == this.hashCode) { if (null == this.getId()) return super.hashCode(); else { String hashStr = this.getClass().getName() + ":" + this.getId().hashCode(); this.hashCode = hashStr.hashCode(); } } return this.hashCode; } public String toString () { return super.toString(); } }
还有登录这段,用了HashMap,好复杂啊,看不明
public void doLogin(LoginInfo loginInfo, HttpSession session) { //使用条件查询获取帐号密码 Map<String, Object> proMap = new HashMap<String, Object>(); proMap.put(LoginInfo.PROP_LOGIN_CODE, loginInfo.getLoginCode().trim()); //密码需要MD5转换 proMap.put(LoginInfo.PROP_PASSWORD, MD5.getMd5(loginInfo.getPassword())); //用户状态:启用 proMap.put(LoginInfo.PROP_STATUS, LoginInfo.LOGIN_STATUS_AVAILABLE); List<LoginInfo> lstLoginInfo = (List<LoginInfo>) loginInfoDao.findByPropertiesEq(LoginInfo.class, proMap, null, 0, 0); //如果帐号不存在则抛出异常 if(lstLoginInfo==null||lstLoginInfo.size()!=1){ throw new LoginServiceException("帐号或密码错误"); } //否则保存帐号信息到session中 session.setAttribute(Constants.SESSION_LOGIN, lstLoginInfo.get(0)); }
http://blessht.iteye.com/blog/979645
发表评论
-
fullcalendar3.0文档笔记
2016-10-26 20:03 17333官方文档地址:https://fullcalendar.i ... -
Android+Jquery Mobile学习系列(5)-SQLite数据库
2014-04-02 15:34 8109目录导航 SQLite是轻量级的、嵌入式的、关系型 ... -
Javascript开发笔记
2013-04-02 11:00 1560获取iframe内的元素 通常我们使用window.f ... -
jquery-validation备忘
2011-06-09 16:54 3363留点学习jquery validation总结的代码: ... -
easyui-datagrid点击下一页直接跳转到最后一页的可能原因
2011-06-03 17:11 8034今天接到一个bug:初次进入页面easyui-datagrid ... -
Jquery-zTree的基本用法
2011-05-05 09:35 297921【简介】 zTree 是利用 J ...
相关推荐
【描述】中的"一个简单的easyui+ssh增删改查"意味着,这个项目提供了一个基本的示例,演示如何在Web应用中整合EasyUI和SSH来实现数据操作。对于初学者来说,这样的项目是一个很好的起点,因为它涵盖了Web开发的核心...
5. **Ajax交互**:EasyUI和SSH框架结合,可以实现无刷新的数据更新。例如,用户在前端进行数据筛选,Ajax请求会将筛选条件传递给后台,返回过滤后的数据并更新到表格中。 6. **响应式布局**:EasyUI支持响应式布局...
这里,我们深入探讨一下使用jQuery EasyUI与SSH框架进行数据操作(增删改查)的基础知识。 jQuery EasyUI是一个基于jQuery的前端框架,它提供了一系列轻量级、易于使用的组件,如表格、对话框、菜单等,用于构建富...
- 前后台数据的增删改查操作。 #### 知识点五:为什么选择这套技术栈? 1. **业务需求**:根据当前市场上对前端技术的需求(如在51job网站上的职位需求),本文档的技术栈能够满足大部分企业的前端开发需求,并...
2. **增删改查**:EasyUI的表格组件支持与后台数据的动态交互,通过Ajax技术实现数据的异步更新。SSH框架中的Struts2负责接收请求,调用服务层进行CRUD操作,最后由Hibernate完成数据的持久化。 3. **分页显示**:...
它支持节点的展开与折叠,以及节点的增删改查操作。在JavaWeb项目中,`tree`常用于展示数据库中的树形结构数据,例如部门结构或文件系统。通过Ajax技术,`tree`可以动态加载子节点,提高用户体验。 `datagrid`是...
每个角色对应一组权限,可通过Struts2的Action进行角色的增删改查,Hibernate操作角色和权限的关系。 3. **权限分配**:将角色的权限分配给具体用户,实现权限的精细化控制。这部分通常涉及到多表操作,Spring的...
管理员在EasyUI的界面上可以查看、审批学生的请假申请,进行数据的增删改查等操作,提升工作效率。 综上所述,SSH请假流管理系统通过整合优秀的开源技术,实现了请假流程的自动化和规范化管理,既保证了系统的稳定...
mysql 增删改查 mysql 外键关联 mysql 连接查询 mysql 事务与索引 mysql python交互 sqlalchemy orm介绍 sqlalchemy 常用语法 sqlalchemy 外键关联 sqlalchemy 多外键关联 sqlalchemy 多对多关联 作业之学员管理系统...