以前无聊写过一个小东西,其中有一个功能就是添加用户,当时并没有考虑用户名重复的问题,今日闲来无事,打算利用ajax的异步刷新来校验用户名是否存在。自己也是新手,刚刚大三,哈哈写的不对的地方请指出。
放上效果图:
首先是编写前的准备
我并不是用原生的js来写的ajax而是用的jqueryeasyUI框架中的ajax,所以在使用之前就必须要引入jquery的js文件。
复制代码
1
2
3
4
5
6<link rel="stylesheet" type="text/css" href="${contextPath}/pages/introcontrol/util/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="${contextPath}/pages/introcontrol/util/themes/icon.css"> <script type="text/javascript" src="${contextPath}/pages/introcontrol/util/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="${contextPath}/pages/introcontrol/util/jquery.easyui.min.js"></script> <script type="text/javascript" src="${contextPath}/pages/introcontrol/util/easyui-lang-zh_CN.js"></script> <script type="text/javascript">
首先是在jsp文件中的编写
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103var isExist = true;//这里设置一个标识符用于后面阻止表单的提交 $(function(){ //表单的验证 $('#fname').validatebox({ required:true , missingMessage:'用户名不能为空!' , precision:0 }); $('#floginname').validatebox({ required:true , missingMessage:'登录名不能为空!', precision:0 }); //对于添加按钮的绑定 $('#addBtn').bind('click',function(){ addUser(); }); }); /** * 添加用户 */ function addUser(){ var obj = $('#orgTree').tree('getSelected'); if(obj){ $('#fdepname').val($('#orgTree').tree('getSelected').text); $('#fdepid').val($('#orgTree').tree('getSelected').id); $('#operator_user').dialog({ width:350, height:300, title:'新增管理', modal:true, buttons:[{ text:'提交', handler: function(){ //判断是否符合条件 if(!isExist){ if($('#operator_user').form('validate')){ $.ajax({ url:"<%=request.getContextPath()%>/peixun/addUser.action", type:"post", dataType:'json', data:$('#myform').serialize(), success:function(data,response,status){ if(data.type=='success'){ $.messager.alert("提示","新增成功!"); $('#sysUserTable').datagrid('reload'); $('#operator_user').dialog('close'); //清空表单 $('#myform')[0].reset(); }else{ $.messager.alert("提示","新增失败!"); } } }); } } } },{ text:'取消', handler: function(){ $('#operator_user').dialog('close'); $('#myform')[0].reset(); } }], }); }else if(obj==null){ alert("未选择树。。。"); } }; /** * AJAX异步校验用户名 */ function checkUserName(){ var floginname = $("#floginname").val(); $.ajax({ url :"${contextPath}/peixun/checkUserName.action", type:'POST', data:{ loginname:floginname }, dataType:'json', success:function(data){ //根据后台返回的数据来进行判断,并给出提示。 if (data.type == "true") { $("#label")[0].innerHTML="<font color='red'>登录名重复</font>"; isExist = true; }else if(data.type == "false") { $("#label")[0].innerHTML="<font color='green'>恭喜你,登录名可以使用</font>"; isExist = false; } }, error:function(data){ alert("获取用户信息失败,请联系管理员!"); } }); }
Action部分
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143package ais.peixun.web; import java.io.Serializable; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import ais.adl.model.TreeNode; import ais.framework.struts.BaseAction; import ais.framework.util.UUID; import ais.peixun.service.PeixunService; import ais.user.model.UUser; public class PeixunAction extends BaseAction { private static final long serialVersionUID = 6269156200927918770L; private PeixunService peixunService; private Map<String, Object> resultMap = new HashMap<String, Object>(); private UUser user; private String id; private String fname; private String floginname; private String name; private String loginname; private String fsex; /** * 添加用户 ** public String addUser(){ try{ if(user !=null){ String id = new UUID().toString(); user.setFuserid(id); Serializable ser = this.peixunService.addOneUser(user); if(ser != null && ser!=""){ this.resultMap.put("type","success"); }else{ this.resultMap.put("type","error"); } } }catch(Exception e){ e.printStackTrace(); } return SUCCESS; } /** * 校驗用戶名是否存在的方法 */ public String checkUserName(){ try{ if(loginname !=null&&loginname !=null){ //这里通过daoImpl返回的数据来进行判断 int count=this.peixunService.checkUserName(loginname); if(count==1){ //将结果true放到 type中返回给前台 this.resultMap.put("type","true"); }else{ this.resultMap.put("type","false"); } } }catch(Exception e){ e.printStackTrace(); } return SUCCESS; } public PeixunService getPeixunService() { return peixunService; } public void setPeixunService(PeixunService peixunService) { this.peixunService = peixunService; } public Map<String, Object> getResultMap() { return resultMap; } public void setResultMap(Map<String, Object> resultMap) { this.resultMap = resultMap; } public String getFname() { return fname; } public void setFname(String fname) { this.fname = fname; } public String getFloginname() { return floginname; } public void setFloginname(String floginname) { this.floginname = floginname; } public String getFsex() { return fsex; } public void setFsex(String fsex) { this.fsex = fsex; } public String getFdepname() { return fdepname; } public void setFdepname(String fdepname) { this.fdepname = fdepname; } public UUser getUser() { return user; } public void setUser(UUser user) { this.user = user; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getLoginname() { return loginname; } public void setLoginname(String loginname) { this.loginname = loginname; } public String getId() { return id; } public void setId(String id) { this.id = id; } }
Service以及ServiceImpl
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53package ais.peixun.service; import java.io.Serializable; import java.util.List; import java.util.Map; import ais.adl.model.TreeNode; import ais.framework.service.IBaseService; import ais.user.model.UUser; public interface PeixunService extends IBaseService { public Serializable addOneUser(UUser user); public int checkUserName(String loginname); } package ais.peixun.service.impl; import java.io.Serializable; import java.util.List; import java.util.Map; import ais.adl.model.TreeNode; import ais.framework.service.impl.BaseServiceImpl; import ais.peixun.dao.PeixunDao; import ais.peixun.service.PeixunService; import ais.user.model.UUser; public class PeixunServiceImpl extends BaseServiceImpl implements PeixunService { private PeixunDao peixunDao; public PeixunDao getPeixunDao() { return peixunDao; } public void setPeixunDao(PeixunDao peixunDao) { this.peixunDao = peixunDao; } @Override public Serializable addOneUser(UUser user){ return this.peixunDao.addOneUser( user); } @Override public int checkUserName(String loginname) { return this.peixunDao.checkUserName(loginname); } }
Dao以及DaoImpl
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16package ais.peixun.dao; import java.io.Serializable; import java.util.List; import java.util.Map; import ais.adl.model.TreeNode; import ais.framework.dao.IBaseDAO; import ais.user.model.UUser; public interface PeixunDao extends IBaseDAO { public Serializable addOneUser(UUser user); public int checkUserName(String loginname); }
package ais.peixun.dao.impl;
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65import java.io.Serializable; import java.sql.SQLException; import java.util.ArrayList; import java.util.List; import java.util.Map; import org.hibernate.HibernateException; import org.hibernate.Query; import org.hibernate.Session; import org.springframework.dao.DataAccessException; import org.springframework.orm.hibernate3.HibernateCallback; import com.sybase.jdbc2.jdbc.Convert; import ais.adl.model.TreeNode; import ais.framework.dao.hibernate.BaseDAOImpl; import ais.organization.model.UOrganization; import ais.peixun.dao.PeixunDao; import ais.resmngt.audobj.model.AuditingObject; import ais.user.model.UUser; /** * @author Forlangel * */ public class PeixunDaoImpl extends BaseDAOImpl implements PeixunDao { /* * 添加用户 */ @Override public Serializable addOneUser(UUser user) { Serializable ser; try{ ser = this.getHibernateTemplate().save(user); }catch(Exception e){ e.printStackTrace(); return null; } return ser; } /* * ajax校验 */ @SuppressWarnings("unchecked") @Override public int checkUserName( String loginname) { //设置一个标识符用于返回 int flag = 0; try{ StringBuffer sbf=new StringBuffer(); sbf.append("from UUser u where u.floginname ="); sbf.append("'"+loginname+"'"); //如果从数据库中查询出数据,表示用户名重复 List<UUser> list =this.getHibernateTemplate().find(sbf.toString()); if( list.size() > 0){ flag = 1; } }catch(Exception e){ e.printStackTrace(); } return flag; } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
最后
以上就是秀丽铃铛最近收集整理的关于jquery easyUI中ajax异步校验用户名的全部内容,更多相关jquery内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复