jQuery ajax 请求和 Submit 提交 form 表单

前台：

<title>modify approver Password</title>
<script type="text/javascript">
$(document).ready(function(){
var oldPass = $("#oldPassword");
var pass = $("#password");
var rePass = $("#rePassword");
$("#content").hide("slow");
//检查要提交的修改密码表单
$("#passForm").submit(function() {
//flag用于判断是否提交表单
var flag = false;
if(oldPass.val() == '') {
alert("请输入您的原始密码！");
oldPass[0].focus();
return false;
}else if(rePass.val() != pass.val()){
$("#content").show("slow");
rePass[0].focus();
return false;
}else if(rePass.val() == '' || pass.val() == ''){
alert("请输入您的新密码！");
return false;
}else{
$.ajax({
type : 'GET',
contentType : 'application/json',
url : '${ctx}/approverPassword/checkPassword.do',
data: 'oldPass=' + oldPass.val(),
dataType : 'text',
//同步
async : false,
success : function(data) {
if("false" == data) {
alert("原始密码输入错误！");
oldPass.val('');
oldPass[0].focus();
flag = false;
}else if("true" == data) {
flag = true;
}
},
error : function() {
alert("修改密码错误，请重新输入");
flag = false;
}
});
}
/*  if(flag) {
alert("密码修改成功，请您重新登录！");
} */
return flag;
});
});
</script>
</head>
<body>
modify approver password.<br/>
<form action="${ctx}/approverPassword/modifyUserPassword.do" id="passForm" name="passForm"  method="post">
<table>
<tr><td><input type="hidden" id="userId" name="userId" value="${user.id }"> </td></tr>
<tr>
<td>原始密码：</td>
<td><input type="text" id="oldPassword" name="oldPassword" maxlength="20"/> </td>
</tr>
<tr>
<td>新密码：</td>
<td><input type="password" id="password" name="password" maxlength="20"/></td>
</tr>
<tr>
<td>再次输入新密码：</td>
<td>
<input type="password" id="rePassword" name="rePassword" maxlength="20" />
<span id="content" style="font-size: 12px; color:red;">两次输入的密码不一样</span>
</td>
</tr>
<tr>
<td><input type="submit" id="submit" name="submit" value="submit"/></td>
<td><input type="button" id="cancel" name="cancel" value="cancel"/></td>
</tr>
</table>
</form>
</body>

后台：

 /**
* check User password
* @param request
* @param response
* @return ModelAndView
*/
@RequestMapping(value="/userPassword/checkPassword", method={RequestMethod.GET, RequestMethod.POST})
@ResponseBody
public String checkPassword(@RequestParam("oldPass") String oldPass) {
String flag1 = "false";
//取得当前用户的密码
long id = SecurityUtil.getUserSession().getId();
User user = userService.findById(id);
String password = user.getPassword();
//从界面接收的旧密码
String oldPassword = Md5.createMD5Password(oldPass);
//两个密码进行比较
if(oldPassword.equals(password)) {
flag1 = "true";
}else{
flag1 = "false";
}
return flag1;
}

/**
* modify user password
* @return ModelAndView
*/
@RequestMapping(value="/userPassword/modifyUserPassword", method={RequestMethod.GET, RequestMethod.POST})
public ModelAndView modifyUserPassword(HttpServletRequest request, HttpServletResponse response) {
ModelAndView mv = new ModelAndView("redirect:/login/goIndexPage.do");
ModelAndView mv1 = new ModelAndView("passwordError");
//获取参数
String oldPass = request.getParameter("oldPassword");
long id = Long.valueOf(request.getParameter("userId"));
String password = request.getParameter("rePassword");
//对String类型的密码进行Md5加密
String Md5Password = Md5.createMD5Password(password);
//得到要修改的实体
User user = userService.findById(id);
//根据user实体user1在表user_access_role表中查找一个UserAccessRole实体 1(user):1(accessRole)
List<UserAccessRole> list = this.userAccessRoleService.getAccessRoleId("user", user);
//从list<UserAccessRole>取出实体accessRole
AccessRole accessRole = list.get(0).getAccessRole();
//得到实体accessRole的角色名name id
String roleName = accessRole.getName();
long roleId = accessRole.getId();
user.setPassword(Md5Password);
//判断权限
if(roleId == userAccessRoleService.USER_ACCESS_ROLE_ID && "true".equals(this.checkPassword(oldPass))) {
//1.修改pccw_iaas表中的userPassword
userService.merge(user);
//2.修改cloud表中的userPassword
cloudStackUserService.modifyCloudStackUserPassword(user.getCloudUserId(), user.getUserName(), Md5Password);
return mv;
}else {
return mv1;
}
}

jQuery ajax 请求和 Submit 提交 form 表单相关推荐

form表单提交以及用Jquery实现ajax提交form表单
在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮(<input type='submit'>)就可以进行数据的提交,每一个input标签都 ...
Jquery通过Ajax方式来提交Form表单
今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({type: "POST",url: & ...
html form通过ajax提交表单提交数据,Jquery通过Ajax方式来提交Form表单的具体实现
今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...
html页面ajax提交数据,ajax请求提交form表单
AJAX表单提交以及数据接收方式一手工收集所有的用户输入,封装为大的"k1=v1&k2=v2-"键值对形式,使用$.post(url, data,fn)把数据提交给服务 ...
form通过ajax提交表单,Jquery通过Ajax方式来提交Form表单
今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...
jquery的ajax提交form表单方式总结
方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModif ...
使用ajax提交form表单，包括ajax文件上传转http://www.cnblogs.com/zhuxiaojie/p/4783939.html...
使用ajax提交form表单,包括ajax文件上传前言使用ajax请求数据,很多人都会,比如说: $.post(path,{data:data},function(data){... },&quo ...
学习日志day45（2021-09-09）（1、有道翻译API使用json格式数据 2、JSONP 3、Ajax提交form表单 4、Web Uploader）
学习内容:学习JavaWeb(Day45) 1.有道翻译API使用json格式数据 2.JSONP 3.Ajax提交form表单 4.Web Uploader 1.有道翻译API使用json格式数据 ...
ajax 表单提交传文件,Ajax提交Form表单及文件上传
刚刚申请下来的博客,写得第一篇.有点小激动,本人以前是一名工业3D设计师突然有些变故做上了JavaWeb开发: 前几天,发现了一些小问题.我在写后台管理页面时,需要上传一张图片.于是我就用很普通的Fo ...

jQuery ajax 请求和 Submit 提交 form 表单

jQuery ajax 请求和 Submit 提交 form 表单相关推荐

最新文章

热门文章

jQuery ajax 请求 和 Submit 提交 form 表单

jQuery ajax 请求 和 Submit 提交 form 表单相关推荐

最新文章

热门文章

jQuery ajax 请求和 Submit 提交 form 表单

jQuery ajax 请求和 Submit 提交 form 表单相关推荐