Question

是否有人使用Daniel Farrel创建的bootstrap-combobox创建了jquery.validate插件？

jquery.validate插件与剩余的bootstrap元素相得益彰，但无法使用bootstrap-combobox。

这是html：

<div class="row">
                <div class="col-sm-4">
                    <label for="categoryParent" class="control-label">Category</label>
                </div>
                <div class="col-sm-8">
                    <select id="categoryParent" name="categoryParent" class="combobox form-control">
                        <option value="" selected="selected">Select the category</option>
<option>...</option>

                    </select>
                </div>
            </div>

和js：

$.validator.setDefaults({
        highlight: function(element) {
            $(element).closest('.row').addClass('has-error');
        },
        unhighlight: function(element) {
            $(element).closest('.row').removeClass('has-error');
        },
        errorElement: 'span',
        errorClass: 'help-block',
        errorPlacement: function(error, element) {
            error.insertAfter(element);
        }
    });

    $("#addProductForm").validate({
        rules: {
            categoryParent: {required: true}
        },
        messages: {                
            categoryParent : "Category required"

        },
        invalidHandler: function() {
            $("#cc-alert").css("display","block");
        },
        submitHandler: function() {

    //
    // more code
    //


            return false;
        }

Answer 1

Bootstrap ComboBox隐藏原始select并将其替换为更具视觉吸引力的内容。但是，jQuery Validate插件只能验证原始select元素，但也会忽略它，因为它是隐藏的。

您只需使用the ignore option将其告知validate hidden elements。

ignore: []  // ignore nothing, validate everything

在您的代码中：

$("#addProductForm").validate({
    ignore: [],
    rules: { ....

OR：

$.validator.setDefaults({
    ignore: [],
    highlight: function(element) { ....

bootstrap-combobox（由Daniel Farrel提供）和jquery-validaiton-plugin

1 个答案: