div下拉列表的jQuery错误验证

时间:2016-09-29 02:39:47

标签: javascript jquery twitter-bootstrap validation

是否可以使用jquery validation来设置Bootstrap样式div下拉列表与选项/选择?我无法在此页面上将标签更改为选项/选择。还有多个div下拉列表。

<div class="btn-group">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
        <span data-bind="label">Month</span><span class="caret"></span>
        <label class="error" for="dobMonth" generated="true"></label>
     </button>
     <ul name="dobMonth" id="dobMonth" class="dropdown-menu">
         <li><a href="#">January</a></li>
         <li><a href="#">February</a></li>
         <li><a href="#">March</a></li>
         <li><a href="#">April</a></li>
     </ul>
 </div>


$(document).ready(function () {
    $("#form").validate({
        rules: {
            "dobMonth": {
                required: true
            }
        },
        messages: {
            "dobMonth": {
                required: "Enter the month you were born"
            }
        },
        submitHandler: function (form) {
            alert('valid form submitted');
            return false;
        }
    });
});

http://jsfiddle.net/sw87W/24/

1 个答案:

答案 0 :(得分:0)

为什么不为它创建自己的自定义验证?如果您使用button和ul,则无法使用jQuery验证。 UI没有名称属性。所以,里面没有任何价值。这里的技巧是检查span innerHTML是否等于'Month'。

以下是它的示例代码。

$('#form').on('submit', function(e){
    e.preventDefault();
  var mo = $('#id-month').html();

  mo == 'Month' ? alert('add error') : alert('remove error');
})

在小提琴上看一下。 http://jsfiddle.net/sw87W/26/

如果您创建原型函数以使其动态化,则由您决定。你可以简单地追加一个带有类(错误,标签错误或其他东西)的元素。如果它是假的,请删除它。之前我使用过jQuery验证器。希望有人可以使用验证器为您提供解决方案。干杯!