jQuery.validate和隐藏输入

Question

我有一个伪选择元素的形式。伪选择元素是一个下拉菜单。当其中一个下拉项目被点击时，隐藏的输入会被分配给该项目的值。我使用jQuery.validate来验证表单。一个简单的验证规则绑定到隐藏的输入。如果输入没有值，则隐藏输入和伪选择将被赋予一个错误类别，并显示错误消息。

我的问题是，更改隐藏输入的值不会触发更改，键入或模糊事件。如果将错误状态应用于隐藏的输入，则在输入被赋予有效值后，该状态将保留。只有当表单再次提交时，输入才能正确验证。

由于jQuery.validate启用隐藏输入验证，我想知道是否有配置或方法来处理这个问题。

编辑：

$form.validate({ 
    ignore: false, 
    rules: { 
     'firstname': 'required', 
     'lastname': 'required', 
     'org': 'required', 
     'role': 'required', 
     'email': { 
      required: true, 
      email: true 
     } 
    }, 
    messages: { 
     'firstname': 'Please enter your first name', 
     'lastname': 'Please enter your last name', 
     'org': 'Please enter your organization', 
     'role': 'Please select your role', 
     'email': 'Please enter your email' 
    }, 
    errorPlacement: function(error, element) { 
     var $errMessage = $('.js-err-message'); 

     $errMessage.removeClass('js-hidden'); 

     $(error).each(function(){ 
      $errMessage.append(error); 

      if (element.is('#role-input')) { 
       $('.pseudo-select').addClass('mad-error'); 
      } 
     }); 

    } 
}); 

Answer 1

使用jQuery验证插件，这些都是标准的事件，将触发特定元素验证（最后一个是有点不同）...

• 打字在一个盒子
• 从列表
• 选择点击复选框或单选按钮
• 失去输入元素
• 的焦点点击提交按钮（整个表单验证）

由于没有这些东西的时候触发一个隐藏的元素值发生变化，则需要触发它通过使用the .valid() method来验证元素。

你已经向我们展示了任何代码，更不用说改变隐藏元素值的代码了，所以我只能给你一些通用的东西。你可以将你使用任何功能更改值内.valid()代码...

• 变化隐藏元素

• 呼叫.valid()的值来验证隐藏元素

  $(document).ready(function() { 
  
      $('#myform').validate({ // initialize plugin 
       // your options 
      }); 
  
      $('#some_button').on('click', function() { 
       // some imaginary button that changes the hidden value 
       $('input[name="myHiddenElement"]').val('newvalue'); // <- change the hidden value 
       $('input[name="myHiddenElement"]').valid(); // <- triggers validation on the hidden element 
      }); 
  
  }); 
  

您可能需要使用其他插件选项（如the errorPlacement option）才能在布局中正确放置错误消息label，否则它将浮动在隐藏元素之后放置。