0

我有一个相当奇怪的问题。仅当我双击按钮单击时才会触发我的验证消息。我认为 Bootstrap 多选和 jQuery 插件存在一些已知问题。

请提出一些解决方法。

JS小提琴

这是代码。

<link href="../../Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="../../Content/bootstrap-multiselect.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="../../Scripts/bootstrap.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="../../Scripts/bootstrap-multiselect.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>

 <form id="myform" action="" method="post">

 <select id="idselect" name="idselect" class="multiselect" multiple="multiple">
     <option value="1">A</option>
     <option value="2">B</option>
     <option value="3">C</option>
 </select>

 <input id="test" type="submit" name="submit" value="Submit" />

 </form>

jQuery

<script type="text/javascript">

    $(document).ready(function () { 
        $('.multiselect').multiselect();


        $("#myform").validate({
            rules: {
                idselect: {
                    required: true
                }
            },
            messages: {
                idselect: {
                    required: "Select atleast one"
                }
            }   
        });

        $('#test').click(function () {
            $("#idselect").valid(); // when i do this based on a suggestion from my previous question, i can at least make it work with a double click. else it wont just work.

        });

    });  
</script>

我不知道如何让引导环境进入小提琴。让我知道我怎样才能更清楚地回答这个问题。问题很简单 - 当我双击时，我会看到验证消息，否则它不会只显示出来。有工作正常的texboxes。问题在于multiselect

4

1 回答 1

2

由于多选插件为您提供了原始select的 adisplay:none并且 jQuery Validate 插件默认会忽略所有隐藏元素，因此您需要禁用该功能。

我只是将ignore选项添加到 jQuery Validate，其中[]参数告诉该插件忽略任何内容。

$("myform").validate({
    // rules & options
    ignore: [],
    ....

此外，根据您之前的问题和当前的 jsFiddle，继续使用 上的change事件处理程序select，而不是click按钮上的处理程序。 （如前所述，这是必需的，因为插件似乎存在选择项目不会触发验证的问题。）

$("#idselect").on("change", function() {
    $(this).valid();
});

演示：http: //jsfiddle.net/bdw1nv9z/8/

于 2014-09-10T13:58:00.447 回答