jQuery复选框验证在引导模式内不起作用

我有一个带有选择字段和复选框列表的表单。复选框位于模式内，单击按钮时打开该模式。jQuery验证适用于模式之外的select，但不适用于复选框

<form id="my_form>
    <div class="form-group">
    <label for="codes" class="control-label">Codes: </label>
        <select id="codes" name="codes" class="form-control required">
          <option value="code1">Code 1</option>
          <option value="code2">Code 2</option>
        </select>
    </div>

    <div class="bottom-margin10">
      <button class="btn btn-primary" data-toggle="modal" data-target="#my-modal"><span></span><span>Select Value Set Names</span></button>
    </div>

    <div class="modal fade" id="my-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
           <div class="modal-dialog">
                <div class="modal-content">
                     <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
                        <h4 class="modal-title" id="myModalLabel">Value Set Names</h4>
                    </div>
                   <div class="modal-body">

                     <div class="checkbox-inline">
                       <label for="new-code">Please Select Value Set Names</label> 
                       <input type="checkbox" name="valueSetIds[]" value="1">Problems<br>
                       <input type="checkbox" name="valueSetIds[]" value="2">Medications<br>
                       <input type="checkbox" name="valueSetIds[]" value="3">Information

                    </div>                                                      
               </div>
               <div class="modal-footer">
                  <button id="btn_cancel_valuesetname" type="button" class="btn btn-default" style="margin: 0 10px 0 0;" 
                                     data-dismiss="modal"  aria-hidden="true">Cancel</button>
                  <button type="savevaluesetname"  class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Save</button>
              </div>
         </div>
       </div>
     </div>
</form>

---

当我提交表单时，它只会抱怨选择字段，但即使未选中复选框也会提交。我试着把复选框放在模态之外，效果很好。但我需要他们在模态内部工作。可能吗？

您的规则与元素名称不匹配。改为：

$("#my_form").validate({
      rules: {
          'valueSets[]': {
              required: true
          }
       }
});

此外，您的表单标记缺少引号

“

，这可能会破坏一切

---

更新：我修复了您的语法错误并进行了验证：

您的规则与您的元素名称不匹配。更改为：

$("#my_form").validate({
      rules: {
          'valueSets[]': {
              required: true
          }
       }
});

此外，您的表单标记缺少引号

“

，这可能会破坏一切

---

更新：我修复了您的语法错误并进行了验证：

假设您的复选框元素已经存在，但在弹出模式之前只是隐藏，您需要通过

忽略
选项启用隐藏元素的验证

$("#my_form").validate({
    ignore: [],  // <-- allows for validation of hidden fields
    rules: {
        'valueSetIds[]': {
            required: true
        }
    }
});

$（“#我的表格”）。验证({
忽略：[]，//假设您的复选框元素已经存在，但在模式弹出之前只是隐藏的，您需要通过
忽略
选项启用隐藏元素的验证

$("#my_form").validate({
    ignore: [],  // <-- allows for validation of hidden fields
    rules: {
        'valueSetIds[]': {
            required: true
        }
    }
});

$（“#我的表格”）。验证({
忽略：[]，//对不起，我在复制粘贴中出错，它在validate方法中的实际值为[]，但仍然不起作用。我更新了我的答案。您不需要忽略隐藏，因为当模式显示时元素未隐藏…对不起，我在复制粘贴中出错，它的实际值为[]在validate方法中，仍然不起作用。我更新了我的答案。你不需要忽略隐藏，因为当模态显示时元素没有隐藏…谢谢！这很有效，我可以看到“Field is required”当我检查元素时。现在我只需要显示外部模式，我认为这可以通过ErrorPlacement完成打开模式的代码也在表单内部，在我的复制粘贴中我忘记添加它。我将更新问题谢谢！这很有效，我可以看到“字段是必需的”当我检查元素时。现在我只需要显示外部模态，我认为这可以通过ErrorPlacement完成打开模态的代码也在表单内部，在我的复制粘贴中，我忘记了添加它。我将更新问题