//修改密码(直接在validate中验证提交)
$("#changePassword").on(ace.click_event, function() {
var html = "";
html += "<div class='changePw'><h1>修改密码</h1></div>";
html += "<div class='row'><div class='col-xs-12'><form name='edit-password' class='form-horizontal' role='form'>";
html += "<div class='form-group'><label class='col-sm-3 control-label no-padding-right'> 用户名 </label>";
html += "<div class='col-sm-9 userName'>${userMsg.userName}";
html += "</div></div>";
html += "<div class='form-group'><label class='col-sm-3 control-label no-padding-right' for='form-field-1'> 旧密码 </label>";
html += "<div class='col-sm-9'><input id='form-field-1' name='oldPassword' placeholder='旧密码' class='col-xs-10' type='password'>";
html += "</div></div>";
html += "<div class='form-group'><label class='col-sm-3 control-label no-padding-right' for='form-field-2'> 新密码 </label>";
html += "<div class='col-sm-9'><input id='form-field-2' name='password' placeholder='新密码' class='col-xs-10' type='password'>";
html += "</div></div>";
html += "<div class='form-group'><label class='col-sm-3 control-label no-padding-right' for='form-field-3'> 确认新密码 </label>";
html += "<div class='col-sm-9'><input id='form-field-3' name='rePassword' placeholder='确认新密码' class='col-xs-10' type='password'>";
html += "</div></div>";
html += "<div class='clearfix'><div class='col-md-offset-3 col-md-9'>";
html += "<button class='btn btn-info' type='submit'><i class='ace-icon fa fa-check bigger-110'></i>修改密码</button></div></div>";
html += "</form></div></div>";
bootbox.dialog({
message: html
});
/*表单验证 */
$("form[name='edit-password']").validate({
rules: {
oldPassword: {
required: true
},
password: {
required: true
},
rePassword: {
required: true,
equalTo: 'form[name="edit-password"] input[name="password"]'
}
},
messages: {
oldPassword: {
required: '旧的密码必须填写',
},
password: {
required: '新的密码必须填写'
},
rePassword: {
required: '确认密码必须填写',
equalTo: '两次密码输入不一致,请重新输入'
}
},
submitHandler: function (form) {
var $form = $(form);
console.log( $form.serializeArray());
$.ajax({
type: "POST",
url: 'admin/user/updatePassWord',
data: $form.serializeArray(),
beforeSend: function () {
$form.find(':submit').prop('disabled', true);
},
success: function (json) {
if(json.errmsg == 1) {
swal({
title: "旧密码不正确",
html: false,
text: "请重新输入旧密码",
type: "error",
showCancelButton: false,
confirmButtonText: "确定",
closeOnConfirm: true
})
return;
}
swal({
title: "修改成功",
html: false,
text: "密码修改成功,下次登录将使用新的密码",
type: "success",
showCancelButton: false,
confirmButtonText: "确定",
closeOnConfirm: true
}).then(function () {
window.location.href = "admin/index?"+Math.random();
});
},
complete: function () {
$form.find(':submit').prop('disabled', false);
}
});
}
});
});
//第二种方法   不提交先验证   在ifram外面验证
$(function() {
/*表单验证 */
$("form[name='edit-password']").validate({
rules: {
oldPassword: {
required: true
},
password: {
required: true
},
rePassword: {
required: true,
equalTo: 'form[name="edit-password"] input[name="password"]'
}
},
messages: {
oldPassword: {
required: '旧的密码必须填写',
},
password: {
required: '新的密码必须填写'
},
rePassword: {
required: '确认密码必须填写',
equalTo: '两次密码输入不一致,请重新输入'
}
}
});
}); //数据提交
function getSubmitData(){
var rtnTag = "none";
var $form = $("form[name='edit-password']");
if($form.valid()){
$.ajax({
type : "POST",
url : 'admin/user/updatePassWord',
data : $form.serialize(),
async: false,
success : function(json) {
rtnTag = json.errmsg;
}
});
}
return rtnTag;
} //ifram框架 加bootbox插件
//修改密码
function changePassword(){ bootbox.confirm({
title: '<i class="ace-icon fa fa-key"></i> 修改密码',
message: '<iframe id="changePW" src="${ctx}/admin/user/getResetPassWord" frameborder="no" border="0" style="width: 100%; min-height: 256px;"></iframe>',
buttons: {
confirm: {
label: '<i class="fa fa-check"></i> 修改密码'
},
cancel: {
label: '<i class="fa fa-times"></i> 取消'
}
},
callback: function (result) {
var $fhBtn = $(".modal-footer").find(".btn-primary");
if (result){
$fhBtn.prop('disabled', false);
var rtnTag = $("#changePW")[0].contentWindow.getSubmitData(); //取到ifram内部方法
if(rtnTag=="none"){
return false;
}else if(rtnTag=="1"){
bootbox.alert({title: "新旧密码一致",message: "请输入与旧密码不一致的新密码",size: 'small'});
var $okBtn = $(".modal-footer").find("button[type='button']");
$okBtn.html("确定");
return false;
}else if(rtnTag=="2"){
bootbox.alert({title: "旧密码不正确",message: "请重新输入旧密码",size: 'small'});
var $okBtn = $(".modal-footer").find("button[type='button']");
$okBtn.html("确定");
return false;
}else {
bootbox.alert({title: "修改成功",message: "密码修改成功,下次登录将使用新的密码",size: 'small'});
var $okBtn = $(".modal-footer").find("button[type='button']");
$okBtn.html("确定");
}
$fhBtn.prop('disabled', true);
}
}
});
var $fhBtn = $(".modal-footer").find(".btn-default");
$fhBtn.css({"float":"right", "margin-left":"10px"});
}

 

ace+validate表单验证(两种方法)的更多相关文章

  1. 使用js提交form表单的两种方法

    提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...

  2. spring mvc 防止重复提交表单的两种方法,推荐第二种

    第一种方法:判断session中保存的token 比较麻烦,每次在提交表单时都必须传入上次的token.而且当一个页面使用ajax时,多个表单提交就会有问题. 注解Token代码: package c ...

  3. Django 构建模板form表单的两种方法

    通常情况下,我们想构建一张表单时会在模板文件login.html中写入 <form action="/your-name/" method="post"& ...

  4. 利用JS提交表单的几种方法和验证(必看篇)

    第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...

  5. 基于jQuery的Validate表单验证

    表单验证可以说在前端开发工作中是无处不在的~ 有数据,有登录,有表单, 都需要前端验证~~  而我工作中用到最多的就是基于基于jQuery的Validate表单验证~  就向下面这样~ 因为今天有个朋 ...

  6. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  7. 【干货】Laravel --Validate (表单验证) 使用实例

    前言 : Laravel 提供了多种方法来验证应用输入数据.默认情况下,Laravel 的控制器基类使用ValidatesRequests trait,该trait提供了便利的方法通过各种功能强大的验 ...

  8. [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  9. Jquery Validate 表单验证的多种方式

    ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...

随机推荐

  1. DBUtils工具类和DBCP连接池

    今日内容介绍 1.DBUtils2.处理结果集的八种方式3.连接池4.连接池的用法1 PrepareStatement接口预编译SQL语句 1.1 预处理对象 * 使用PreparedStatemen ...

  2. android studio中使用x5 webview来读写cookies的问题

    本人新手,刚接触AS也没有多久,记录下两个问题. 1. 怎么在android studio中写入cookies 把写入cookies的动作放在了主界面的onCreate事件中了,看了腾讯的说明,说是要 ...

  3. gRPC官方文档(安全认证)

    文章来自gRPC 官方文档中文版 认证 gRPC 被设计成可以利用插件的形式支持多种授权机制.本文档对多种支持的授权机制提供了一个概览,并且用例子来论述对应API,最后就其扩展性作了讨论. 马上将会推 ...

  4. [C++11]shared_ptr循环引用导致内存泄露

    1 /* 2 * shared_ptr循环引用导致内存泄露 3 */ 4 5 struct A 6 { 7 shared_ptr<A> ptr; // 改为weak_ptr<A> ...

  5. Oracle SQL判断字符串是否在目标字符串中的函数

    转自:http://dacoolbaby.iteye.com/blog/1772156 根据需求,写了一段方法. 用于识别以下的情况: 判断 字符串A  在用逗号分隔的字符串B中是否存在 如: v_s ...

  6. poj1811(pollard_rho模板)

    题目链接: http://poj.org/problem?id=1811 题意: 判断一个数 n (2 <= n < 2^54)是否为质数, 是的话输出 "Prime" ...

  7. 一些意想不到的小bug。

    一,当if的时候,很容易忘记相对的else,从而出现bug,要将背面消息考虑全面. 二,多个元素在同一行布局的时候,要考虑文字的换行还是省略号代替. 例如:左边一个文字,宽度不固定,右边一个图形,宽度 ...

  8. 2019.2.14 考试T1 FFT

    \(\color{#0066ff}{ 题目描述 }\) 衡水二中的机房里经常有人莫名其妙地犇雷,leizi很生气,决定要找出那个犇雷的人 机房有n个人,每个人都认为机房里有两个人可能会犇雷,其中第i个 ...

  9. CF1076C Meme Problem 数学

    Try guessing the statement from this picture: You are given a non-negative integer d . You have to f ...

  10. [JSOI2009]瓶子和燃料 BZOJ2257 数学

    题目描述 jyy就一直想着尽快回地球,可惜他飞船的燃料不够了.有一天他又去向火星人要燃料,这次火星人答应了,要jyy用飞船上的瓶子来换.jyy的飞船上共有 N个瓶子(1<=N<=1000) ...