javascript jQuery验证选择2

sqyvllje 于 2023-01-24 发布在 Java

关注(0)|答案(1)|浏览(101)

我用jQuery验证插件验证我的表单。我用jQuery select2插件更改样式下拉菜单。如果验证回调错误，我的输入显示/添加类错误框（红色边框）否则显示/添加类成功框（绿色边框）。这在正常输入中工作，但不会在select2中工作。当我选择选择框错误框（红色边框）的任何值时，不会隐藏/切换到成功框。select2在单击提交按钮后工作。
联森：

$('form').validate({
    rules: {
        firstname: {
            minlength: 3,
            maxlength: 15,
            required: true
        },
        lastname: {
            minlength: 3,
            maxlength: 15,
            required: true
        }
    },
    highlight: function (element, errorClass, validClass) {
        if (element.type === "radio") {
            this.findByName(element.name).addClass(errorClass).removeClass(validClass);
        } else {
            $(element).closest('.form-group').removeClass('has-success has-feedback').addClass('has-error has-feedback');
            $(element).closest('.form-group').find('i.fa').remove();
            $(element).closest('.form-group').append('<i class="fa icon-plane icon-2x form-control-feedback"></i>')
        }
    },
    unhighlight: function (element, errorClass, validClass) {
        if (element.type === "radio") {
            this.findByName(element.name).removeClass(errorClass).addClass(validClass);
        } else {
            $(element).closest('.form-group').removeClass('has-error has-feedback').addClass('has-success has-feedback');
            $(element).closest('.form-group').find('i.fa').remove();
            $(element).closest('.form-group').append('<i class="fa icon-plane icon-2x  form-control-feedback"></i>');
        }
    },
    errorElement: 'span',
    errorClass: 'help-block',
    errorPlacement: function (error, element) {
        if (element.parent('.input-group').length) {
            error.insertAfter(element.parent());
        } else {
            error.insertAfter(element);
        }
    }
});
$("#lstColors").select2({
    placeholder: "Select a Color",
    width: "200px"
});

如何解决这个问题？!
演示：http://jsfiddle.net/hTPY7/1413/

JavaScript

来源：https://stackoverflow.com/questions/24963990/jquery-validation-select2

1条答案

按热度按时间

sdnqo3pr1#

jquery.validate没有注意到select 2的变化，虽然我不知道为什么会这样，但你可以通过注意表单是什么时候提交的来解决这个问题（也许可以对用户提交的任何表单应用'submit'类）：

$('form').submit(function() { 
    $(this).addClass('submitted');
});

然后在select 2发生变化时调用$（）.valid（），使jquery.validate重新验证表单：

$('#lstColors').change(function() {
    if ($('form').hasClass('submitted'))
        $('form').valid();
});

下面是一个jsFiddle fork，它可以工作：http://jsfiddle.net/Tdafh/1/

赞(0）回复(0）举报 2023-01-24

我来回答

javascript jQuery验证选择2

1条答案

相关问题

热门标签

最新问答