jQuery验证未针对复选框触发 [英] jquery validation is not getting fired for checkboxes

问题描述

我有一个使用jQuery验证从前端进行验证的表单.

I have a form where I am using jQuery validation to do validation from front end side.

大多数验证都可以按照我的要求进行.但是，对于复选框，验证不起作用.我的验证jquery中有以下规则和消息

Most of the validation are working as I want it to. However , for the checkboxes, the validation not working. I have the following rules and messages in my validation jquery

  $('#submitDetails').validate({
    // 1. validation rules.
    rules: {
    ......
    ......
    ......
      custom9: {
        required: true
      },
      custom10:{
          required:true
      },
      custom11: {
        required: true
      }
    },
    // 2. Validation fail messages
    messages: {
      custom9: {
        required: "You can only claim your Plush Rewards once you have received all your items found on your reciept"
      },
      custom10: {
        required: "You must agree to the terms of conditions in order to claim your Plush Rewards Prepaid Visa Gift Card"
      },
      custom11: {
        required: "You must agree to the terms of conditions in order to claim your Plush Rewards Prepaid Visa Gift Card"
      }
    ......
    ......
    ......

html是

<div class="ticks">
    <div class="col-xs-12  tick1">
        <input type="checkbox" data-label="Have you received your entire order from Plush?" name="custom9" id="custom9" value="0" class="styled myClass prettyCheckable"><span class="mandatory tick1Mandatory"> * </span>

    </div>
    <!--<div id="error_msg"></div>  -->
    <div class="col-xs-12 tick2">
        <input type="checkbox" data-label="Please tick if you would like to join our mailing list and receive special bonus offers and the latest Plush news" name="custom10" id="custom10" value="1" class="styled myClass prettyCheckable" checked>
    </div>
    <div class="col-xs-12 tick3">
        <input type="checkbox" data-label="I have read and agree to the Terms and Conditions of this promotion and understand the Plush Privacy Policy" name="custom11" id="custom11" value="0" class="styled myClass prettyCheckable"><span class="mandatory tick2Mandatory"> * </span>

    </div>
</div>

单击提交按钮时，不会触发与custom9-11有关的验证.

When the submit button is clicked the validations concerned with custom9-11 do not get fired.

推荐答案

可能已经晚了几年，但以防万一有人遇到这个问题:

It's probably a few years late, but just in case someone else runs into this problem:

从标记中，我可以告诉您正在将prettyCheckable插件用于您的复选框.可能是您的实际复选框被prettyCheckable隐藏了，而Validation插件却忽略了它们吗?

From the markup I can tell you are using the prettyCheckable plugin for your checkboxes. Could it be possible that your actual checkboxes are hidden by prettyCheckable and the Validation plugin is ignoring them?

在这种情况下，您可以尝试通过更改jquery.validate插件的忽略设置来解决此问题:

If that's the case, you could try fixing this by changing jquery.validate plugin's ignore setting:

    $.validator.setDefaults({ 
        ignore: [] // DON'T IGNORE PLUGIN HIDDEN SELECTS, CHECKBOXES AND RADIOS!!!
    });

这篇关于jQuery验证未针对复选框触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！