【问题标题】:Using Dynamic JQueryValidation and Adding Rules使用动态 JQueryValidation 和添加规则
【发布时间】:2014-08-09 10:13:45
【问题描述】:

我目前正在开发一个网站并使用 Jquery 验证插件验证我的页面。我希望根据用户点击提交按钮时检查的复选框组合来验证表单的某些元素。

在我的表单上,我有一个书籍选择列表框,然后在它的正下方我有一个月份选择框,然后在它下方是一个日期选择框。在这些列表框下方是 3 个复选框,我们称它们为复选框 A、B 和 C。当没有选择 A、B、C 复选框时,我只想制作所需的图书列表框。我这样做是有原因的。

现在,在阅读了一些关于动态验证的示例后,我有了一些我认为可以工作但实际上不行的代码。也许我遗漏了一些明显的东西或做错了。我觉得这应该很容易,也许我不理解某些东西。下面是我的代码。

<script>

        var _validator;

        $(function() {


            _validator = $('#bookFormID').validate({


                errorClass: "error",
                validClass: "valid",

                rules: {


                    bookListBox: {required: false},
                    months: {required: false},
                    days: {required: false},


                },

                messages: {
                    bookListBox: "Please select a workstation.",
                     months: "Please select a month.",
                    days: "Please select a day.",

                    },

                highlight: function(element){



                    $(element).closest('.control-group').removeClass('success').addClass('error');
                },

                success: function(element){


                    $(element).closest('.control-group').removeClass('error').addClass('success');

                }

            });

            $('#submitbuttonID').click(function(e){


                if($('#checkboxA')[0].checked == false && $('#checkboxB')[0].checked == false &&
                              $('#checkboxC')[0].checked == false)
                {
                    $('#bookListBoxID').rules('add', "required");
                }

                if(_validator.form())
                {
                    $('#bookFormID').submit();
                }

            });


        });


        </script>

【问题讨论】:

    标签: javascript jquery html validation checkbox


    【解决方案1】:

    http://jqueryvalidation.org/validate#rules

    看第二个例子:

    $(".selector").validate({
      rules: {
        contact: {
          required: true,
          email: {
            depends: function(element) {
              return $("#contactform_email:checked")
            }
          }
        }
      }
    });
    

    希望这会有所帮助。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-11-16
      • 2016-09-27
      • 2013-05-06
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多