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. Behave + Selenium(Python) 三

    来自T先生 通过之前的2篇文章,大家都了解了如果利用behave和selenium打开网页和进行基本的操作,但是这些对于项目来说,却是往往不够的. 如果对junit或者TestNG熟悉的人都知道有@B ...

  2. GridSplitter用法

    1.GridSplitter的ShowsPreview设置为True时拖动报null错误 解决方法在Grid外面包装一个装饰器:AdornerDecorator,至于为什么这么做,暂时还不知道 2.当 ...

  3. 2014 ACM广东省赛总结

    2014年广东省赛在化工大学城开,5月10日开幕式&热身赛,5月11日正式赛. 热身赛的时候,开幕式说有两小时,于是我们愉快的切题了,像平常组队赛那样很快出了两题,但卡在后面两题切不动了.这时 ...

  4. linux 下定位程序假死

    ps -ef | grep 程序名称 pstack 程序的进程ID

  5. “MVC+Nhibernate+Jquery-EasyUI”信息发布系统 第一篇

    一.第一篇内容中必须得简单的介绍一下MVC(在大学时用的是WebForm,拖控件感觉很爽,但是工作后,技术总监让一定要放弃这种 想法!) 1.MVC是什么?:(1) ASP.NET MVC是微软官方提 ...

  6. 杭电1002_A + B Problem II

    这是该题的链接http://acm.hdu.edu.cn/showproblem.php?pid=1002 具体的题的内容就不过多描述了,想必你已经知道了,当我看完这道题后就知道咋写了,可是这道题从开 ...

  7. 脚本执行JavaScript代码

    下面是一个具体的demo测试脚本引擎,执行javas文件. package Rhino; import java.io.FileReader;import java.net.URL; import j ...

  8. Codevs 1444 “破锣摇滚”乐队

    1444 “破锣摇滚”乐队   题目描述 Description 你刚刚继承了流行的“破锣摇滚”乐队录制的尚未发表的N(1 <= N <= 20)首歌的版权.你打算从中精选一些歌曲,发行M ...

  9. Programming Ruby 阅读笔记

    在Ruby中,通过调用构造函数(constructor)来创建对象 song1=Song.new("Ruby") Ruby对单引号串处理的很少,除了极少的一些例外,键入到字符串字面 ...

  10. 笔记-JavaWeb学习之旅14

    JSTL:JavaServer Pages Tag Library JSP标准标签库 if标签 <%@ page import="java.util.ArrayList" % ...