JQuery 验证插件validate的showErrors参数的使用

1.showErrors的定义

http://jqueryvalidation.org/validate   介绍了showErrors的定义。

 

showErrors

Type: Function()

A custom message display handler. Gets the map of errors as the first argument and an array of errors as the second, called in the context of the validator object. The arguments contain only those elements currently validated, which can be a single element when doing validation onblur/keyup. You can trigger (in addition to your own messages) the default behaviour by calling this.defaultShowErrors().

Example: Update the number of invalid elements each time an error is displayed. Delegates to the default implementation for the actual error display.

1

2

3

4

5

6

7

8

 

$(".selector").validate({

showErrors: function(errorMap, errorList) {

$("#summary").html("Your form contains "

+ this.numberOfInvalids()

+ " errors, see details below.");

this.defaultShowErrors();

}

});

The callback gets passed two arguments:

  • errorMap

    Type: Object

    Key/value pairs, where the key refers to the name of an input field, values the message to be displayed for that input.

  • errorList

    Type: Array

    An array for all currently validated elements. Contains objects with the following two properties:

    • message

      Type: String

      The message to be displayed for an input.

    • element

      Type: Element

      The DOMElement for this entry.

2.使用

这里参数一errorMap是一个该函数被调用时传入的key/value对,即一个对象。这里就涉及到了如何访问这个对象的"key",与 "value"。

下面这段代码演示了如何在JS中访问key与value。

       

var a = {
    a:1,
    b:2
};
for(var b in a){
    alert(b + ":" + a[b]);
}

遍历对象a,每次方位到key即变量b,而访问value则通过a[b],或者a.b。这样这个errorMap就可以访问了。

 

errorMap定义描述了,这里的key代表这输入域(可以是一个input控件)的name属性的值,而values则是这个控件需要显示的错误提示。现以下面这段代码为例。

 

rules:{
    'biz_loan_info_extLists[0].carBrand':{
        required:true,
        rangelength:[1,30]
    }
},
messages:{
     'biz_loan_info_extLists[0].carBrand':{
         required:'汽车品牌型号不能为空,且长度范围1至30个字符',
         rangelength:'输入应为1-30个字符'
     }
}

 

当validate验证失败时,其name即key,就是rules中定义需要验证的控件的name,上述代码为biz_loan_info_extLists[0].carBrand,而value就是其对应的message部分。例如当没有提供输入时,message为required部分,即'汽车品牌型号不能为空,且长度范围1至30个字符'。当输入字符长度不在1-30这个范围内时,提示输入应为1-30个字符。

 

定义完上述内容,就该使用showErrors函数在我指定的位置显示错误提示信息了,代码如下。

 

showErrors:function(errorMap,errorList){
    for(var prop in errorMap){
        $("[name="+"'"+prop+"'"+"]").next(".help-block").text(errorMap[prop]);
    }
}

 

这里prop为key,由于prop为一个变量,因此需要在使用 单引号(')。这样即就完成了自定义的消息显示。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值