Jquery plugins 使用Jquery验证插件验证引导选择

我面临着验证select的问题，它使用bootstrap-select.js插件和jquery验证插件进行了美化。bootstrap-select.js需要类选择器和以下一行代码：

$('.selectpicker').selectpicker();

用于美化html的选择

然而，它在使用jqueryvalidate插件进行验证时造成了问题。除非和直到未删除类选择器选取器，否则“选择入”根本不会被验证。一旦类被移除，则正确执行验证。 以下是我选择的html：

<select class="input-medium required" id="editCategory_sltCategoryName"
name="editCategory_sltCategoryName">
    <option value="">
        Select Category
    </option>
    <option>
        Reusable Components
    </option>
    <option>
        BU Connects
    </option>
</select>

---

我也尝试过为它编写自定义方法，但没有用。

我将根据您所描述的内容尽我所能回答您的问题，因为我相信我遇到过类似的问题，并且能够解决它

$('#frm_editCategory').validate({
    ignore: ":hidden:not(.selectpicker)"
});

首先，我假设您使用

selectpicker（）

方法正确初始化了

select

。上面，你写道

$('.selectpicker').selectpicker();

但是您没有任何带有类

selectpicker

的

select

元素，所以我认为您要写的是

$('select').selectpicker();

当您调用

selectpicker（）

时，引导程序将在

选择
元素后插入其他元素（
div
、
按钮
、
span
、
ul
和
li
）。但是请注意，引导程序随后将
隐藏（）
您的原始
选择
元素因为您的
select
是隐藏的，JQuery Validate在提交表单时将忽略对它的验证。这是主要问题

要让Jquery Validatenot忽略隐藏的select输入，可以执行以下操作

// Initialize form validation rules, submit handler, etc.
$('#frm_editCategory').validate({
  .
  .
  .
});

// The default value for $('#frm_editCategory').validate().settings.ignore
// is ':hidden'.  Log this to the console to verify:
console.log($('#frm_editCategory').validate().settings.ignore);

// Set validator to NOT ignore hidden selects
$('#frm_editCategory').validate().settings.ignore = 
  ':not(select:hidden, input:visible, textarea:visible)';

为什么还需要包括
输入：可见
和
文本区域：可见
？以前，设置是忽略所有隐藏的输入。如果您只忽略了
：not（选择：hidden）
，您将忽略任何不是隐藏的
选择
。不过，这过于宽松，因为可见的
输入[type=text]
不是隐藏的
select
。因此，它也会被忽略。我们希望忽略以下任何元素：

- is *not* a hidden `select`
- *is* a hidden `input`
- *is* a hidden `textarea`

- is *not* a hidden `select`
- is *not* a visible `input`
- is *not* a visible `textarea`

要将这一切都放入
：not
选择器，您需要忽略以下任何元素：

- is *not* a hidden `select`
- *is* a hidden `input`
- *is* a hidden `textarea`

- is *not* a hidden `select`
- is *not* a visible `input`
- is *not* a visible `textarea`

因此

$('#frm_editCategory').validate().settings.ignore = 
  ':not(select:hidden, input:visible, textarea:visible)';

以下是对我来说完美无瑕的东西：

jQuery/javascript:

HTML:

问题：引导选择元素已得到验证，但在每个其他输入元素上显示默认消息
此字段是必需的
，而不是使用以前配置的所有自定义验证消息覆盖它

修复：将
忽略
设置移动到
$.validator.setDefaults（{…}）
块中。。。那就够了
 这里有一个简单的解决方案，对我来说很有效：

var validator = $('#frm_editCategory').validate({
    .
    .
    .
});

$('select.input-medium').on('change', function () {
    validator.element($(this));
});

就这样
节省了我很多时间，谢谢！唯一的问题是它不会突出显示引导选择元素红色，但是会显示所需的消息，并且验证会阻止表单提交，因此这是一个很好的开始。对于我自己来说，我有合法的隐藏选择，但我不想验证，所以我将其稍微扩展，以仅处理选择器：$（“#表单”）。validate（）.settings.ignore='：不（select.selectpicker，select:visible，input:visible，textarea:visible）'；这里的人真好！。。。清晰明了，提供定制选项的想法。。。我从来都不是那种喜欢摆弄客户的人，但这让我走得很快。OP应将此标记为确认答案。我希望我能多次投票。
$('#myform').validate().settings.ignore = 
    ':not(select:hidden, input:visible, textarea:visible)';

var validator = $('#frm_editCategory').validate({
    .
    .
    .
});

$('select.input-medium').on('change', function () {
    validator.element($(this));
});