MiniUI表单验证实践
学习实践:

<form id="form2">
<div id="update_pas" style="width:380px">
<table class="fore-common-form-tabs">
<tr>
<td class="text">
旧密码
</td>
<td class="input" colspan="2">
<input id="oldPas" name="oldPas" required="true" onvalidation="onCheckOldPwd" vtype="rangeLength:8,20" value="" class="mini-password" style="width:160px;"/>
<span id="oldPas_msg" style="color: red">*</span>
</td>
</tr>
<tr>
<td class="text">
新密码
</td>
<td class="input" colspan="2">
<input id="newPas" name="newPas" required="true" onvalidation="onCheckNewPwd" vtype="rangeLength:8,20" value="" class="mini-password" style="width:160px;"/>
<span id="newPas_msg" style="color: red">*</span>
</td>
</tr>
<tr>
<td class="text">
确认密码
</td>
<td class="input" colspan="2">
<input id="newPasRe" name="newPasRe" required="true" onvalidation="onCheckPwdIsSame" vtype="rangeLength:8,20" value="" class="mini-password" style="width:160px;"/>
<span id="newPasRe_msg" style="color: red">*</span>
</td>
</tr>
</table>
<div class="fore-core-btnboxs" style="text-align: center">
<button class="mini-button" id="update_submit" onClick="updatePass();">
确认
</button>
<button class="mini-button" id="update_exit">
关闭
</button>
</div>
</div>
</form> <script type="text/javascript">
mini.parse();
/* alert(str.match(/[\u0000-\u00ff]/g)) //半角
alert(str.match(/[\u4e00-\u9fa5]/g)) //中文
alert(str.match(/[\uff00-\uffff]/g)) //全角 */
function updatePass(){
var form = new mini.Form("#form2");
form.validate();
if(form.isValid()){
var oldPass=mini.get("#oldPas").value;
var newPass=mini.get("#newPas").value;
var new_re_pas=mini.get("#newPasRe").value;
var userObjId=Forestar.App.loginUser.objectID;
var code="uerObjectId="+userObjId+"&newPas="+newPass+"&oldPas="+oldPass;
$.ajax({
type:"POST",
url:"updatePassword.do",
data:code,
success:function(data){
if(data=="1"){
$("#update_exit").trigger('click');
mini.alert("密码修改成功");
}else if(data=="2"){
mini.alert("原始密码输入错误");
}else{
mini.alert("密码修改失败");
}
}
});
}
} function onCheckOldPwd(e){
if(e.value==""||e.value.length<8||e.value.length>20){
$("#oldPas_msg").html("*请输入8~20位原密码 ");
e.isValid=false;
return ;
}
$("#oldPas_msg").html("*");
} function onCheckNewPwd(e){
if(e.value==""||e.value.length<8||e.value.length>20){
$("#newPas_msg").html("*请输入8~20位新密码 ");
e.isValid=false;
return ;
}
$("#newPas_msg").html("*");
} function onCheckPwdIsSame(e){
var newPass=mini.get("#newPas").value;
if(e.value==""||e.value.length<8||e.value.length>20){
$("#newPasRe_msg").html("*请输入8~20位确认密码 ");
e.isValid=false;
return ;
}
if(newPass != e.value){
$("#newPasRe_msg").html("*两次新密码输入不一致 ");
e.isValid=false;
return ;
}
$("#newPasRe_msg").html("*");
} function isEnglish(e) {
var re = new RegExp("^[a-zA-Z\_]+$");
if (re.test(e)) return true;
return false;
} function isNumber(e) {
var re = new RegExp("^[0-9]+$");
if (re.test(e)) return true;
return false;
} function isEnglishAndNumber(e) {
var re = new RegExp("^[0-9a-zA-Z\_]+$");
if (re.test(e)) return true;
return false;
} function isChinese(e) {
var re = new RegExp("^[\u4e00-\u9fa5]+$");
if (re.test(e)) return true;
return false;
} function isStandard(e) {
var re = new RegExp("^[\u0000-\u00ff]+$");
if (re.test(e)) return true;
return false;
} function isUnStandard(e) {
var re = new RegExp("^[\uff00-\uffff]+$");
if (re.test(e)) return true;
return false;
} </script>
MiniUI表单验证实践的更多相关文章
- 基于Bootstrap+jQuery.validate Form表单验证实践
基于Bootstrap jQuery.validate Form表单验证实践 项目结构 : github 上源码地址:https://github.com/starzou/front-end- ...
- miniui表单验证守则总结
1,页面效果图 2,代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- MiniUI表单验证总结
原文地址:https://www.cnblogs.com/wllcs/p/5607890.html 1,页面效果图 2,代码实现 <!DOCTYPE html PUBLIC "-/ ...
- Miniui 表单验证
自定义表单验证: input输入框的表单验证可通过vtype和onvalidation事件两种方式实现 可编辑列表(例如div)的表单验证只能通过vtye来实现表单验证 (1)vtype方式: jsp ...
- 由表单验证说起,关于在C#中尝试链式编程的实践
在web开发中必不可少的会遇到表单验证的问题,为避免数据在写入到数据库时出现异常,一般比较安全的做法是前端会先做一次验证,通过后把数据提交到后端再验证一次,因为仅仅靠前端验证是不安全的,有太多的htt ...
- MiniUI官方表单验证示例
原文地址:http://www.miniui.com/docs/tutorial/validator.html 表单验证 参考示例: 验证规则 表单验证 表单验证:文本提示 表 ...
- 再说表单验证,在Web Api中使用ModelState进行接口参数验证
写在前面 上篇文章中说到了表单验证的问题,然后尝试了一下用扩展方法实现链式编程,评论区大家讨论的非常激烈也推荐了一些很强大的验证插件.其中一位园友提到了说可以使用MVC的ModelState,因为之前 ...
- angularjs 表单验证(不完整版)
针对项目实践表单验证总结: angular 的 form表单验证:form内需要novalidate取消默认验证,用ng自己的验证,form的名字是非常必要的 栗子:以注册为栗子,下面是注册的部分: ...
- 如何优雅的使用 Angular 表单验证
随便说说,这一节可以跳过 去年参加 ngChine 2018 杭州开发者大会的时候记得有人问我: Worktile 是什么时候开始使用 Angular 的,我说是今年(2018年) 3 月份开始在新模 ...
随机推荐
- XPath知识点【一】
什么是 XPath? XPath 使用路径表达式在 XML 文档中进行导航 XPath 包含一个标准函数库 XPath 是 XSLT 中的主要元素 XPath 是一个 W3C 标准 XPath 路径表 ...
- 微信小程序分享朋友圈 长海报 canvas 动态高度计算
业务场景 在微信中 小程序无法分享到朋友圈,目前大部分的解决方案都是,canvas动态绘制 生成图片后,保存到用户相册,用户进行分享照片到朋友圈,朋友圈打开图片后识别二维码进入小程序,达到分享目的 g ...
- SQL 执行 底层原理(一)
一.SQL Server组成部分 1.关系引擎:主要作用是优化和执行查询.包含三大组件: (1)命令解析器:检查语法和转换查询树. (2)查询执行器:优化查询. (3)查询优化器:负责执行查询. 2. ...
- nginx 配置文件详解(转)
#运行用户 #user nobody; #启动进程,通常设置成和cpu的数量相等或者2倍于cpu的个数(具体结合cpu和内存).默认为1 worker_processes 1; #全局的错误日志和日志 ...
- 小程序框架之视图层 View
(1)视图层View 框架的视图层由 WXML 与 WXSS 编写,由组件来进行展示. 将逻辑层的数据反应成视图,同时将视图层的事件发送给逻辑层. WXML(WeiXin Markup languag ...
- 【转】以Python为例的Async / Await的编程基础
转, 原文:https://www.cnblogs.com/middleware/p/11996731.html 以Python为例的Async / Await的编程基础 -------------- ...
- 圆柱模板价格计算器V1.0版本
因很多客户需求,就做了一个初始版本的产品圆柱模板面积和价格的计算器,界面非常简单,做工粗糙,但是功能是可以运行.后期会在界面和功能上进行升级,打算出一个微信小程序版本.这个程序仅供参考. 演示地址:h ...
- JS判断移动端访问设备并加载对应CSS样式
JS判断不同web访问环境,主要针对移动设备,提供相对应的解析方案(判断设备代码直接copy腾讯网的) // 判断是否为移动端运行环境 if(/AppleWebKit.*Mobile/i.test(n ...
- [VSCode] Custom settings
{ // UI IMPROVEMENTS —————————————————— // Part 1. "editor.minimap.enabled": false, " ...
- 【概率论】5-10:二维正态分布(The Bivariate Normal Distributions)
title: [概率论]5-10:二维正态分布(The Bivariate Normal Distributions) categories: - Mathematic - Probability k ...