如何在提交没有特定库的表单时验证 selectize 元素？

问题描述

我想在提交表单时验证 selectize 元素。

<form method="post" accept-charset="utf-8" action="/user/edit/2">
    ...
    <div class="selectize">
        <select name="roles" multiple required>
        </select>
    </div>
    ...
    <button type="submit" />
</form>

<script>
var user_roles = $('.selectize select[name="roles[]"]');
var $user_roles = user_roles.selectize({
    options: [{
        value: 'admin',label: 'Admin'
    },{
        value: 'user',label: 'User'
    },{
        value: 'developer',label: 'Developer'
    }],plugins: ['remove_button'],delimiter: ',',persist: false,maxItems: null,placeholder: 'Select a role ...',valueField: 'value',labelField: 'label'
});
...

如您所见，我向 selectize 元素 required 添加了一个属性。

在这种情况下，如果我点击提交，它不会显示任何内容。

如果 selectize 元素的值为空，我想显示没有任何库的普通 jQuery 验证消息或添加任何验证脚本，如下图所示。

同一表单中的其他字段显示验证消息，如图片，但 selectize roles 元素除外。

解决方法

这是因为选择版本问题。

将版本 0.11.0 降级到 0.8.5 对我有用。所以我认为我们应该报告错误或新功能，甚至降级工作。