Question

我想做什么：
我需要验证是否选中了复选框，而下拉列表应为空，使用带有内联类名称的JQuery验证插件（jqueryvalidation - bassistance）

我在做什么：
我正在尝试使用添加自定义验证规则 JQuery验证插件（jqueryvalidation - bassistance）并使用'shouldBeEmptyIf' 在使用param

的复选框的类名中

/*JS function to return status of checkbox*/
function getValue(){
    return  $('[name=checkBox1]').prop('checked');
}


/*Form element using class for validation - JQuery validation plugin*/
<input type="checkbox" name="checkBox1" class="{shouldBeEmptyIf: [getValue() , $('[name=dropDownElement]').val())=='']}">

<select name="dropDownElement" size="1" > 
          <option value="1">One</option> 
          <option value="2">Two</option> 
</select>


/*custom method added in additional-methods.js of the JQuery validation plugin*/
jQuery.validator.addMethod("shouldBeEmptyIf", function(value, element, param) {
    console.log("param[0]: " + param[0] + "  param[1]: " + param[1]);
    return ( param[0] && param[1] );
}, "This field must be empty");

我遇到的问题：
我确实得到了param [0]和param [1]的值，但它们被'缓存'它们保持不变即使我更改下拉菜单或选择/取消选中复选框（也尝试添加getValue（）函数，希望每次都能获得新的值，但它没有用。）

加载页面时获取初始值。是否在加载页面时分配静态值？如果是这样，我如何使用内联类

的JQuery验证插件实现我想要做的解决方案

任何帮助和指导都将受到赞赏

谢谢

Answer 1

在尝试找到几种不同的方式后，我最终以这种方式使用，如果他们试图做类似的事情，思想可能会对其他人有所帮助。

我没有传递元素的值，而是传递元素的名称（或者你想要的元素的id），并在附加方法本身中使用传递的名称/ id获取那些元素的当前值。有效。。

以下是更新后的代码：

/*Updated html Form element*/
<input type="checkbox" name="checkBox1" class="{shouldBeEmptyIf: [checkBox1 , dropDownElement]}">

<select name="dropDownElement" size="1" > 
          <option value="1">One</option> 
          <option value="2">Two</option> 
</select>


/*Updated additional method*/
jQuery.validator.addMethod("shouldBeEmptyIf", function(value, element, param) {
    var valid =true;
    if($('[name='+ param[0] +']').prop('checked') && $('[name='+ param[1] +']').val()!=''){
        valid = false;
    }
    return valid; 
}, "This field must be empty");

希望这可能有所帮助。

Answer 2

Validator最适合表单。将输入包装在表格中。

  <form>
   <input type="checkbox" name="checkBox1">
  </form>

您必须定义验证处理程序：

$('#myform').validate({
    rules : {
        dropDownElement: { shouldBeEmptyIf : true }
    }
});

然后它将运行验证程序预提交。我确信还有其他方法可以将自定义验证器绑定到单个元素，这只是一种明确的方法。我不认为您需要以这种方式定义类，尽管您可以尝试。

使用带有类名的param添加JQuery验证插件自定义方法

2 个答案: