关于结合easyui框架修改密码的一些问题
出现的问题:当点击修改密码提交按钮时,先获取原密码,传到后台进行密码验证,然后通过验证结果判定是否执行修改。当时验证密码的函数和修改密码的函数是分开写的,只是在修改密码的函数里先调用验证密码的函数,但是验证是使用post的异步请求,导致修改密码的函数还没有得到验证的结果就往下执行了。导致提前获取的验证结果始终为undefined,然后它就一直走的else,即不修改密码。
展示错误代码:
$("#doUpdate").click(function(){
var flag =checkPwd();
if(flag){
$.messager.progress();
$('#dataFrm').form('submit',{
url:'${ctx}/user/updatePwd.action',
method:'post',
doSubmit:function(){
var isValid = $(this).form('validate');
if(!isValid){
$.messager.progress('close');
}
return isValid;
},
success:function(obj){
$.messager.progress('close');
var data = eval('('+obj+')');
if(data.code==200){
window.parent.location.href = "${ctx}/index.jsp";
}
}
});
}else{
$.messager.show({
title:'提示',
msg:'原始密码错误'
});
}
});
function checkPwd(){
var oldPwd = $("#oldPwd").val();
var result;
$.post("${ctx}/user/checkPwd.action",{pwd:oldPwd},function(obj){
result = obj;
};
return result;
}
解决方案:不要将它们分成两个函数,直接将修改密码的函数放到验证密码的post请求的回调函数中,这样就不会出现提前执行的问题。
正确代码展示:
<script type="text/javascript">
$("#doUpdate").click(function(){
var pwd = $("#pwd").val();
var rePwd = $("#rePwd").val();
if(pwd!==rePwd || pwd==''){
return;
}else{
var oldPwd = $("#oldPwd").val();
$.post("${ctx}/user/checkPwd.action",{pwd:oldPwd},function(result){
if(result){
$.messager.progress();
$('#dataFrm').form('submit',{
url:'${ctx}/user/updatePwd.action',
method:'post',
doSubmit:function(){
var isValid = $(this).form('validate');
if(!isValid){
$.messager.progress('close');
}
return isValid;
},
success:function(obj){
$.messager.progress('close');
var data = eval('('+obj+')');
if(data.code==200){
window.parent.location.href = "${ctx}/index.jsp";
}
}
});
}else{
$.messager.show({
title:'提示',
msg:'原始密码错误'
});
}
});
}
});
// extend the 'equals' rule
$.extend($.fn.validatebox.defaults.rules, {
equals: {
validator: function(value,param){
return value == $(param[0]).val();
},
message: '两次密码不相同'
}
});
</script>