Easyui validatebox的验证提示十分好用,可是在实际项目的运用中,经常会遇到需要服务器验证后并返回验证结果信息,比如验证用户名、手机号、邮箱是否已存在。于是就想着怎么拓展Easyui的验证策略,使其支持服务端验证。具体实现代码如下:

文件名称:jquery.easyui.extend.validate.js

/**
* 功能:拓展easyui 自定义验证框规则
* 用法: 与easyui自带的验证框使用方法一致
*/
$.extend($.fn.validatebox.defaults.rules,{
minLength:{// 判断最小长度
validator:function(value,param) {
return value.length>=param[0];
},
message:'请最少输入{0}个字符.'
},
length:{
validator:function(value,param){
var len=$.trim(value).length;
return len>=param[0]&&len<=param[1];
},
message:"输入内容长度必须介于{0}和{1}之间."
},
phone:{// 验证电话号码
validator:function(value) {
return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
},
message:'格式不正确,请使用如下格式:020-88888888'
},
mobile:{// 验证手机号码
validator:function(value) {
return /^(11|12|13|14|15|16|17|18|19)\d{9}$/i.test(value);
},
message:'手机号码格式不正确,请使用如下格式:13118957545'
},
idcard:{// 验证身份证
validator:function(value) {
return /^\d{15}(\d{2}[A-Za-z0-9])?$/i.test(value);
},
message:'身份证号码格式不正确'
},
intOrFloat:{// 验证整数或小数
validator:function(value) {
return /^\d+(\.\d+)?$/i.test(value);
},
message:'请输入数字,并确保格式正确'
},
currency:{// 验证货币
validator:function(value) {
return /^\d+(\.\d+)?$/i.test(value);
},
message:'货币格式不正确'
},
qq:{// 验证QQ,从10000开始
validator:function(value) {
return /^[1-9]\d{4,9}$/i.test(value);
},
message:'QQ号码格式不正确'
},
integer:{// 验证整数
validator:function(value) {
return /^[+]?[1-9]+\d*$/i.test(value);
},
message:'请输入大于0的整数'
},
number:{// 验证数字
validator:function(value) {
return /^[+]?[0-9]+\d*$/i.test(value);
},
message:'请输入正整数'
},
chinese:{// 验证中文
validator:function(value) {
return /^[\u0391-\uFFE5]+$/i.test(value);
},
message:'请输入中文'
},
english:{// 验证英语
validator:function(value) {
return /^[A-Za-z]+$/i.test(value);
},
message:'请输入英文'
},
unnormal:{// 验证是否包含空格和非法字符
validator:function(value) {
return /.+/i.test(value);
},
message:'输入值不能为空和包含其他非法字符'
},
username:{// 验证用户名
validator:function(value) {
return /^[a-zA-Z][a-zA-Z0-9_]{5,15}$/i.test(value);
},
message:'用户名不合法(字母开头,允许6-16字符长度,允许字母数字下划线)'
},
faxno:{// 验证传真
validator:function(value) {
// return /^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/i.test(value);
return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
},
message:'传真号码不正确'
},
zip:{// 验证邮政编码
validator:function(value) {
return /^[1-9]\d{5}$/i.test(value);
},
message:'邮政编码格式不正确'
},
ip:{// 验证IP地址
validator:function(value) {
return /d+.d+.d+.d+/i.test(value);
},
message:'IP地址格式不正确'
},
name:{// 验证姓名,可以是中文或英文
validator:function(value) {
return /^[\u0391-\uFFE5]+$/i.test(value)|/^\w+[\w\s]+\w+$/i.test(value);
},
message:'请输入姓名'
},
carNo:{ //验证车牌号码
validator:function(value){
return /^[\u4E00-\u9FA5][\da-zA-Z]{6}$/.test(value);
},
message:'车牌号码无效(例:粤J12350)'
},
carenergin:{
validator:function(value){
return /^[a-zA-Z0-9]{16}$/.test(value);
},
message:'发动机型号无效(例:FG6H012345654584)'
},
email:{ //验证邮箱
validator:function(value){
return /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value);
},
message:'请输入有效的电子邮件账号(例:abc@126.com)'
},
msn:{ //验证msn
validator:function(value){
return /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value);
},
message:'请输入有效的msn账号(例:abc@hotnail(msn/live).com)'
},
same:{ //确认两次密码是否一致
validator:function(value,param){
if($("#"+param[0]).val() !=""&&value!=""){
return $("#"+param[0]).val() ==value;
}else{
return true;
}
},
message:'两次输入的密码不一致!'
},
// 验证编码是否重复【后端服务器验证返回】
productBasisVerify: {
validator: function(value, param) {
if (value != "") {
var result = false;
$.ajax({
type: 'POST',
url: ProductBase.urls['verifyData'],
data: {verify: param, value: value},
dataType: 'json',
async: false, // 关闭异步
success: function(rec) {
if (rec.success){
result = true;
} else {
result = false;
}
}
});
return result;
}
},
message: '该编码已被使用,请换个试试!'
},
license:{//验证营业执照
validator:function(value){
return/^\d{15}$/.test(value);
},
message:'营业执照格式输入错误'
},
texture:{//验证组织机构代码
validator:function(value){
return/^[a-zA-Z0-9]\S(([0-9]){7}\S)?[a-zA-Z0-9]+$/.test(value);
},
message:'组织机构代码格式输入错误'
},
taxation_number:{//验证税务登记证
validator:function(value){
return/(^\d\S{14}|^\d\S{17})$/.test(value);
},
message:'税务登记证格式输入错误'
},
bank_account:{//验证银行卡号
validator:function(value){
return/^[0-9]*$/.test(value);
},
message:'银行卡号格式输入错误'
},
});

Easyui本身的验证机制是设置一个计时器,然后按照计时器触发验证规则进行验证,但是对应长的文本输入框,就会导致还未完全输入就已经验证了好几次了。有人说把Easyui的计时器修改短一点不就行了嘛,但是对于编码、手机号码这些短的字段要进行校验呢?校验效果又不理想了,所以最终的解决办法如下:

<script type="text/javascript">
$(function(){
     // 元素失去焦点进行验证
$('#base_part_edit_form .easyui-validatebox-blur').bind('blur', function(){
$(this).validatebox('enableValidation');
});
     // 元素获得焦点关闭验证
$('#base_part_edit_form .easyui-validatebox-blur').bind('focus', function(){
$(this).validatebox('disableValidation');
});
})
</script>

Easyui validatebox后台服务端验证的更多相关文章

  1. ASP.NET的服务端验证(干货)

    最近有项目需要使用.net的web,啥也不说,直接开始学习.net的mvc框架.感觉微软的web项目其实还是很好用的,今天和大家分享一下服务端验证的事情.其实原理就是用到了c#的特性,特性不用多说,大 ...

  2. .net使用FluentValidation进行服务端验证。

          背景 最近使用asp.mvc 做一个在线口语系统项目,在服务端验证问题遇到了一些小问题. 自己根据数据库表user定义一个数据库表实体对象UserDbEntity [Table(" ...

  3. ASP.NET MVC如何实现自定义验证(服务端验证+客户端验证)

    ASP.NET MVC通过Model验证帮助我们很容易的实现对数据的验证,在默认的情况下,基于ValidationAttribute的声明是验证被使用,我们只需 要将相应的ValidationAttr ...

  4. JSR-303 Bean Validation 介绍及 Spring MVC 服务端验证最佳实践

    任何时候,当要处理一个应用程序的业务逻辑,数据校验是你必须要考虑和面对的事情. 应用程序必须通过某种手段来确保输入参数在上下文来说是正确的. 分层的应用在很多时候,同样的数据验证逻辑会出现在不同的层, ...

  5. C#在服务端验证客户端证书(Certificate)

    使用https协议进行通讯的时候可以设置双向证书认证,客户端验证服务端证书的方法前面已经介绍过了,现在说一下在服务端验证客户端证书的方案. 这里给出的方案比较简单,只需要在Service端的配置文件中 ...

  6. Asp.net MVC 服务端验证多语言错误

    服务端验证用户提交信息时为了实现多语言使用了资源文件,如: using System.ComponentModel.DataAnnotations; public class UserModel { ...

  7. MIME类型-服务端验证上传文件的类型

    MIME的作用 : 使客户端软件,区分不同种类的数据,例如web浏览器就是通过MIME类型来判断文件是GIF图片,还是可打印的PostScript文件. web服务器使用MIME来说明发送数据的种类, ...

  8. Angular4 后台管理系统搭建(9) - 用自定义angular指令,实现在服务端验证

    最近这段时间发现,北京这用angular4 或 angular2的公司很少.几乎是没有.很担心自己是不是把精力放到了不应该的地方.白耽误了时间.但是随着我对新版angular框架理解的加深.个人感觉a ...

  9. 微信小程序支付源码,后台服务端代码

    作者:尹华南,来自原文地址 微信小程序支付绕坑指南 步骤 A:小程序向服务端发送商品详情.金额.openid B:服务端向微信统一下单 C:服务器收到返回信息二次签名发回给小程序 D:小程序发起支付 ...

随机推荐

  1. git repo

  2. 01_SQlite数据库简介

  3. sqlserver2012——INTERSECT交查询

    1. select a.成绩编号,a.分数,b.姓名 From 成绩信息 a,学生信息 b ' 一般的查询 a.成绩编号,a.分数,b.姓名 From 成绩信息 a,学生信息 b ' order a. ...

  4. 教妹学 Java:晦涩难懂的泛型

    00.故事的起源 “二哥,要不我上大学的时候也学习编程吧?”有一天,三妹突发奇想地问我. “你确定要做一名程序媛吗?” “我觉得女生做程序员,有着天大的优势,尤其是我这种长相甜美的.”三妹开始认真了起 ...

  5. Solr 6.7学习笔记(02)-- 配置文件 managed-schema (schema.xml) - filter(5)

    自定义fieldType时,通常还会用到filter.filter必须跟在tokenizer或其它filter之后.如: <fieldType> <analyzer> < ...

  6. hihoweek 137(简单完全背包)

    题目链接:http://hihocoder.com/contest/hiho137/problem/1 题意:中文题诶- 思路:各层的成本计算不会有影响,所以我们只要把没一层的成本计算出来在求和就是答 ...

  7. hyperledger fabric 1.0.5 分布式部署 (八)

    gdb debug peer 程序 在开始我们从 github 上download 下来的源码包,实际上已经包含了可执行的 peer 程序,但是该程序是使用 release 方式编译的,并不支持gdb ...

  8. 道阻且长 莫失本心(我的OI之旅

    道阻且长 莫失本心      今天午睡醒来,发现自己发烧了.尽管穿的很厚,尽管今天的阳光如此明媚.身体还是由内而外地散发着冷意. 期末考已经结束了,接下来又是艰难而难忘的奥赛训练.(要到春节才能放假了 ...

  9. Java程序动态编译Java源文件

    最近接触到公司一个项目,需要将生成的源码动态编译,记录下学习过程. 先贴出官网推荐写法: JavaCompiler.CompilationTask getTask(Writer out,        ...

  10. Hexo写作系列(3) - 文章标题含有双引号"导致页面渲染失败无法打开

    问题 在用Hexo写文章时,如果文章标题含有双引号",也就是说如果在文件头里的title出现双引号,如下: --- title: Hexo - 文章标题含有双引号"导致页面渲染失败 ...