如何在多个字段的基于DIV的select表单元素上使用jQuery Validate

时间:2013-02-14 09:08:45

标签: jquery jquery-validate

您好我已提及this下拉框验证。如果我有多个表示它没有正确显示

,它只适用于一个下拉列表
$(document).ready(function () {
    $('.default').dropkick();
    $('.example_form').validate({
        highlight: function (element, errorClass) {         
            $(element).siblings('.dk_container').addClass('error');  
            $('.dk_toggle').css('border', 'none');
        },
        unhighlight: function(element, errorClass) {
            $(element).siblings('.dk_container').removeClass('error');  
            $('.dk_toggle').css('border', '1px solid #ccc');
        }
    });
});

这是fiddle

如何突出显示每个字段的错误

2 个答案:

答案 0 :(得分:2)

试试这个小提琴:

http://jsfiddle.net/yWANA/5/

现在已修好。

问题出在你写的高亮代码上。

如果你突出显示警告,你会发现它只会出现错误

以下是一些代码:

 $(document).ready(function () {
$('.default').dropkick();
$('.example_form').validate({
    highlight: function (element, errorClass) {   
         $(element).prev().addClass('error');
         //$(element).prev().addClass('error'); 
         $('.dk_toggle').css('border', 'none');
    },
    unhighlight: function(element, errorClass) {
        $(element).prev('.dk_container').removeClass('error');  
        $('.dk_toggle').css('border', '1px solid #ccc');
    }
});

});

答案 1 :(得分:1)

每个下拉列表只有一个隐藏字段,并在更改下拉列表值时将值分配给隐藏字段。并将必填字段验证写入隐藏字段

$('#country').dropkick({
    change: function (value, label) {
        $('#countryHidden').val(value);
      }
});

$('.example_form').validate({
   ignore: "",
    rules : {
        countryHidden : {
            required: true
        }
    },
    messages : {
      countryHidden : {
            required:"Please select your  country"              
        }  
    } 
});

fiddle

相关问题