aralejs / validator Goto Github PK

View Code? Open in Web Editor NEW

41.0 41.0 28.0 917 KB

Form Validator Widget

Home Page: aralejs.org/validator/

JavaScript 100.00%

validator's People

Contributors

Stargazers

Watchers

validator's Issues

0.9.2版本Validator在form的submit事件上阻止默认失效

使用的Validator版本是0.9.2，在form的submit事件上阻止默认行为event.preventDefault()失效，不知道有没有什么办法解决？
是通过DOM调用的，然后Widget.autoRenderAll()
谢谢

Validator 效验的补充需求

最近使用了aralejs的validator效验组件，还是挺不错的，扩展能力很强，唯一，我认为缺少的一个需求就是排除输入项。
强烈建议开发组增加：exclude排除输入项API接口。
这样就可以对输入的字符进行限制，例如用户名不允许输入admin，adminstartors，等等这些特殊字符。
这个需求是比较强烈的。
另外希望url地址，加如svn，ftp常用url前缀。
@leoner

dom有disabled属性的item，不做校验

需求简单描述：

表单里有一个 checkbox，

checked的时候，若干item是 需要校验且提交到后台 的，

unchecked的时候，这若干item是 不需要校验且也不需要提交到后台 的

目前的做法是 控制dom的disabled状态 + 调用 addItem/removeItem ，比较麻烦

如果校验框架在校验的时候发现这个dom是disabled的，直接不做校验 就方便了，且也符合逻辑

@lizzie @shaoshuai0102

关于ie6/7中设置novalidate的问题

core.js的setup方法直接设置novalidate在ie6/7中报错(jquery-1.8.3)

this.element.attr("novalidate", "novalidate");

参考
jquery-validation/jquery-validation#490
jquery-validation/jquery-validation#555

组合规则错误提示显示的问题

假如“昵称(nickname)”的规则是这样的：只可以中文，2-7个字。

且规则库有"chinese"这个规则。

那么我的nickname规则是这样的：

Validator.addRule(
    'nickname', 
    Validator.getRule('chinese').and('minlength', {min:2}).and('maxlength',{max:7})
    '昵称格式不正确'
);

我希望用户输入"aaa"时，显示"chinese"这条规则的错误提示信息，用户输入“王"时，显示"minlength"这条错误提示信息。

目前无论哪条规则判断失败出现的都是规则"nickname"的错误提示信息。

checkNull为true（默认值）时没效果

Validator.addRule('test', function(){
    alert('输入为空时不会触发校验条件！');

    return true
}, 'test');

validator.addItem({
    element: '[name=subject]',
    checkNull: true,
    rule: 'test'
});

代码如上，如果input框里没有内容的时候blur，不会去触发test的rule

validator 从 0.8.6 升级到 0.9.5 之后校验规则不能连着 3 个以上的 or

例如： getRule("one").or("two").or("three") 这样下去，代码不报错，但结果不符合期望。原先的 0.8.6 版本支持！

utils.isHidden 判断有问题

<select style='display:none'>
     <option value="1">1</option>
     <option value="2">2</option>
     <option value="3">3</option>
     <option value="4">4</option>
</select>

utils.isHidden()返回的是 false ！

jquery 版本是 1.8.3

尽早报错和 failSilently

from 相当当

有的表单可能有 50 个要校验的 DOM，和各自的校验规则。但是每次页面可能是根据情况只渲染出其中 10个DOM，对其校验。如果可以页面上 addItem 50 条，只校验出现的 DOM，没有的就跳过将会非常舒服。

异步校验咋样给后台传值

    Validator.addRule('checkIdCard', function(options, commit) {
        $.getJSON('./checkIdCard.do', function(data) {
            commit(data.valid, data.message);
        });
    });

aralejs中的validator的使用问题

可能是我没有看明白文档的使用，文档的使用的确有些不容易看吧！

我是这样使用的

用spm install [email protected]下载了validator的模块。

出现了一个sea-modules的模块，里面是arale模块。

在sea.config仅仅给validator配置了别名。

在需要使用valicator的时候，var Validator = requres('validator').

之后，做validator的additem。

请问下，这样使用方法对吗？

onItemValidated 的回调参数中应包括 item 对象

包括 onItemValidate 这样的事件。

如我定义个规则如下：
Validator.addRule('checkEmail', function(options, commit) {
$.ajax({
url:'<%=basePath%>member/member_check?mode=checkEmailAvailable',
data:{checkStr: options.element.val()},
complete: function(data) {
data = eval('(' + data.responseText + ')');
commit(data.state == 'ok' ? null : data.state, data.msg);
}
})
});
var myEmail = Validator.getRule('email').and('checkEmail');
此时如在input框输入错误的email,确是提示“请输入邮箱”，即提示的内容是data-explain里的值，按理要提示“邮箱的格式不正确”

如何验证ajax提交的表单元素

validator组件在ajax提交的时候怎么验证表单。

在api和例子里面都没有找到。

我将验证的代码放到ajax请求之前，也是没有任何得到验证。坐等解决方案。

validator 目前的文档略显杂乱

@shaoshuai0102 同学有空，重构下。

这个组件使用量还是很大的。

要声情并茂哦~

Validator.addItem里的element参数不支持className等多元素的选择器

为什么不直接用 jQuery.Validate

refer to http://bassistance.de/jquery-plugins/jquery-plugin-validation/

初略看下，功能差不多

有什么特殊功能是 jQuery.Validate 没有的么？

一些事件的 api 调整

base 准备去掉 parseEventsFromAttrs 功能， aralejs/base#15，validator 的 api 可以调整成事件。

onItemValidate: setterConfig,
onItemValidated: setterConfig,
onFormValidate: setterConfig,
onFormValidated: setterConfig,

以上的属性，用户使用的时候可以这样

new Validator().on('ItemValidate', function() {})

0.9.2版本没有在spm服务器上

http://modules.spmjs.org/arale/validator/ 上没有0.9.2版本
谢谢

我不想把验证错误显示为红色的边框，怎么办？

边框变红效果都不要了
这个怎么实现？红色有点刺眼

Validator.query 重构

目前 Widget 增加了 query 方法：

http://aralejs.org/widget/examples/auto-render.html

邵帅看下 Validator.query 是否可以基于 Widget.query 重构下？

from 崔护

有种需求，目前无法简单的用配置实现

需求描述：表单里有2个字段， 手机 & 座机
校验逻辑：格式准确就不说了，关键是 2者中至少有1个是必填的

本来通过 required: false 来跳过强制的 required 校验，但是如果2者都设置了 required: false , 在2者都为空的情况下，完全不会进入校验逻辑 。

这个问题要如何解决呢？

0.9.1版本的异步校验Example运行结果不正确！

http://aralejs.org/validator/examples/async-validation.html

我记得0.9.0版本的时候运行结果是Ok的。

我在项目中已经在使用validator组件，希望尽快修复这个问题。

源码看到这里，禁不住吐糟！

Core类中的setup方法有如下语句。

 this.on('formValidate', function () {
    var that = this;
    $.each(this.items, function (i, item) {
      that.query(item.element).get('hideMessage').call(that, null, item.element);
    });
  });

其中 that.query(item.element) 不就是 item 本身吗？

难道有特殊的原因，让你选择了绕圈？？

跟据ruleName获取具体字段的校验出错文案

场景

后端校验后，不是返回校验出错文案，而是返回校验出错的规则名称。

前端根据规则名称，获得真正的出错文案并显示出来。

问题产生原因

国际站表单已经实现了前后端校验的一致性，可以保证后端的校验规则在前端都会存在。由于出错文案是由文案模板拼凑出来的，而且会用到{{display}}等跟dom结构相关的文案，后端拼凑模板困难比较大。

所以，我们这边的方案是，后台只输出出错的规则名称，前端会将其对应的文案显示出来。

现今框架不能满足的原因

现今框架的校验文案目前由内部模块Rule进行控制，最终根据Item相关的自定义参数、{{display}}等拼凑出真正的错误文案。

但，没有暴露公用api接口。

自己的方案

Item提供getMessage接口，用于获得最终的错误文案。该接口会结合ruleName, {{display}}、自定义参数，拼凑出文案。

我fork了一个分支，代码已经ci：https://github.com/johnnychen/validator

最终调用方法

var item = validator.query('#selector');
var errorMessage = item.getMessage('ruleName');
    console.log("获得了我想要的文案：" + errorMessage);

item.js 中使用了`:visible`伪类选择器

RT
line 64

建议在Validator.element下获取Item的DOM元素

当页面上存在多个name相同的元素时，多个表单的validator之间会相互冲突。

https://github.com/aralejs/validator/blob/master/src/item.js#L24

var element = $(this.get('element')),
      type = element.attr('type');

将$(this.get('element'))改成类似与$(this.get('element'), validator.element)。

在富客户端程序中，经常有多个同类型的表单同时存在的情况，最好能避免相互之间的冲突。

addRule方法回调函数this指向问题

如题，个人觉得：

Validator.addRule('idcard', function (options){
   //TODO this指向当前 Validator 实例更合理
}, '{{display}}错误');

对checkbox / radio 进行required校验时，默认的提示文字可以改成“请选择{{display}}"。

reqiured为空，其他rule不生效

现在这边有个需求：

某个字段，可以不填，但是你要是填的，就必须按正确的格式填写

最简单的想法，写个 自定义rule，来做格式的操作，然后 reqiured:false

结果发现： 自定义的rule死活不生效

再看了下源码发现： 如果设置了 reqiured 为 false，就不进行其他规则的校验了。

从某种程度上来说，上面的逻辑是合理的，但是就是有那么极少数的情况，非 reqiured 的时候也要进行别的校验， 希望能修改这段逻辑，或者能给出别的解决方案：（

ie6下对textarea元素校验报Form field with type 'textarea'not supported!的错误

多选题，如何实现多个checkbox 验证只少选择两个以上

errormessage重写后无法替换自定义的{{}}

Validator.addRule('test', function(options){
    options.index = 9;

    return false;
}, '第{{index}}个字符有问题！');

validator.addItem({
    element: '#input1',
    rule: 'test',
    errormessageTest: '这里的错误提示中的{{index}}不会被替换！'
});

#Core-execute文档描述错误

http://aralejs.org/validator/docs/api.html#Core-execute

 validator.execute(function(element, error, message) {
        console.log(arguments);
    });

回调函数的参数应该是(hasError, results, element)

校验规则组合bug

代码如下：

// 非email规则
Validator.addRule('notEmail', Validator.getRule('email').not());
Validator.setMessage('notEmail', '不能输入email!');

// 某个字段添加rule
validator.addItem({
    element: '[name=subject]',
    required: true,
    rule: 'notEmail',
    errormessageNotEmail: '特殊的错误提示不会显示！'
});

在subject字段输入email内容后，错误提示会出现，但是不会出现个性化定制的提示特殊的错误提示不会显示！，而是统一提示不能输入email!'

代码追踪后发现是item.js的66行这里有问题

 _metaValidate(this.element, this.get('required'), rules, this.get('display'), function(err, msg) {
    if (err) {
         var message = that.get('errormessage') || that.get('errormessage' + upperFirstLetter(err)) || msg;
    } else {
         var message = msg;
    }
    that.trigger('itemValidated', err, message, that.element);
    callback && callback(err, message, that.element);
});

err本来在校验不通过对时候要返回ruleName，比如上面代码的notEmail，但结果在通过not方式由rule：email生成的rule：notEmail的校验过程中，err返回的是true，导致'errormessage' + upperFirstLetter(err)的结果不正确

具体原因没有继续追踪查找

针对bootstrap的validator.js

默认的validator.js的是针对支付宝的。

鉴于bootstrap的流行度，可以出个针对bootstrap的validator.js，方便大家使用。

autoFocus影响了explain元素的事件冒泡

一个用场景如下：

不填写任何数据直接点击登录（explain元素的关闭按钮事件已经委托在form元素上）出现错误提示，然后点击帐号那个提示发现无法关闭，需要点击两次，其他的没有问题。用控制台跟踪发现第一次点击关闭按钮的时候是没有执行回调的。。。

0.9.0版本没有在spm服务器上

如题 http://modules.spmjs.org/arale/validator/ 上没有0.9.0版本，通过spm无法加载到

hideMessage 去除 message 参数

hideMessage: function(message, element, event) {}

改成

hideMessage: function(element, event) {}

From eyunfeis: 调用起来确实不方便，比较难难理，这个有点像是为get，和set方法都加一个val参数似的，set(val), get(val)

focus 在文本框时，直接点击提交无反应

from 颂赞

focus 在文本框时，直接点击提交无反应。

在base-debug.js看有arale/base/1.0.1/aspect-debug,没有这个文件

在base-debug.js看有arale/base/1.0.1/aspect-debug,没有这个文件啊！

又一个文档错误，干脆别把文档放出来，让大家直接看代码就好了！！

没见过你们这么写文档，不清楚就算了，简直就是误导，浪费大家的时间！！！知道为什么用arale的前端这么少吗？妈的，不仅仅文档写得不清楚，而且错误百出！！！

异步检验。operator 函数将收到一个 options 对象作为第一个参数，commit 函数作为第二个参数，用来提交校验结果。commit 接受两个参数，第一个是 error 对象，如果校验通过，则这一项应该为 null；第二个是提示消息。
Validator.addRule('checkUseranmeAvailable', function(options, commit) {
$.post('http://youdomain/checkUsernameAvailable', {username: options.element.value}, function(data) {
commit(data.state == 'ok' ? null : data.state, data.msg);
})
});

Validator在火狐下效率很差

跟踪发现是jquery的sizzle占用的时间最多，估计是Validator中的选择器用了某个效率极低的选择器！还有一些优化，例如 #24 所说，很多已经抓取过的元素可以直接传递过来，而没有必要重复抓取！

removeItem时同时remove掉这个item对应的error的dom

场景：
在某个input校验出错后会显示对应的错误信息的dom结构，这时候去调用removeItem把这个input对应的校验规则移除，结果错误信息的dom结构并没有移除，一直显示在那，也无法消除

解决方案：
在validator.js里override下removeItem方法，加上对hideMessage的调用就OK了

动态改变校验规则时的问题

就拿http://aralejs.org/validator/examples/dynamic-change-validation.html 官方这个例子说吧，首先输入了7位的数字，把radio选到「Mobile」上，然后把focus点到「号码」上，再点击一下「Phone」，这个时候校验「Mobile」的错误提示会一闪而过。

录了一个视频 http://v.youku.com/v_show/id_XNTk4MzUxNjYw.html

rule调用增强

validator.addItem({
    element: '#promoter',
    rule: 'asynccheck'
});

现在的rule调用方式是用字符串来调用的，就照成很多东西只能是静态的，对于一些验证规则需要重复写或者要在验证规则里和element耦合，如果改成下面的方式调用会更灵活，定制更强大！

validator.addItem({
    element: '#promoter',
    rule: {
        asynccheck: [] // 参数列表，必须是数组形式（可在Validate中做hack，非数组或者函数的话转换成数组形式），如果是函数则动态调用
    }
});

form.submit()不提交button和submit的name和value造成表单操作失败

问题原因在CM2001，用的ASP.NET控件，由于这个问题，submit上的name和value没有post过去，照成控件无法调用相应方法，请教各位大神有没有解决办法，这个坑跳的很郁闷！