如何更改Jquery require_from_group方法的默认样式

How can I change the default styling for Jquery require_from_group method?

本文关键字:方法 默认 样式 group from 何更改 Jquery require      更新时间:2023-09-26

我正在使用jQuery验证插件来生成一个警报,如果用户没有使用require_from_group方法在组中至少选中一个框来查找表单,就会弹出该警报。然而,有很多复选框,当警报出现在所有三十个复选框选项的中间时,看起来很奇怪。我只希望在组的顶部出现一个警报。如何做到这一点?

这是我所说的图片:

当我只想要一个时,有三十四个警报

HTML:

<div class="form-group">
  <label for="inputPassword3" class="col-sm-2 control-label">Occupation: Check All That Apply</label>
  <div class="col-sm-10">
    <div class="checkbox">
      <label>
        <input class="occupation-group" onchange="showHideControlgrowerchecks();" type="checkbox" name="Grower" id="Grower"> Grower</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" name="PCA_Consultant" id="PCA_Consultant"> PCA/Consultant</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" name="Packer_Processor" id="Packer_Processor"> Packer/Processor</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" name="Research_Gov_Ed" id="Research_Gov_Ed"> Research/Gov/Ed</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" name="Assn_Commission" id="Assn_Commission"> Assn/Commission</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" name="Suppliermfgsvc" id="Suppliermfgsvc"> Supplier/Mfg/Svc</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" name="Ad_Agency" id="Ad_Agency"> Ad Agency</label>
      <br>
      <label>
        <input class="occupation-group" type="checkbox" onchange="showHideControloccupation();" name="Other" id="Other"> Other</label>
      <br>
      <br>
      <input type="text" class="form-control" style="display:none" name="Occupation-Other" id="Occupation-Other" placeholder="Please Specify Other Occupation Here" required>
      <br>
      <br>

    </div>
  </div>
</div>

Javascript:

$("#form1").validate({
  rules: {
    Grower: {
      require_from_group: [1, ".occupation-group"]
    },
    PCA_Consultant: {
      require_from_group: [1, ".occupation-group"]
    },
    Packer_Processor: {
      require_from_group: [1, ".occupation-group"]
    },
    Research_Gov_Ed: {
      require_from_group: [1, ".occupation-group"]
    },
    Assn_Commission: {
      require_from_group: [1, ".occupation-group"]
    },
    Suppliermfgsvc: {
      require_from_group: [1, ".occupation-group"]
    },
    Ad_Agency: {
      require_from_group: [1, ".occupation-group"]
    },
    Other: {
      require_from_group: [1, ".occupation-group"]
    }
  }
});

require_from_group方法没有"默认样式"这样的东西。

要将34条消息合并为一条消息,请使用groups选项。

如果你不喜欢插件将验证消息放在哪里,可以使用errorPlacement选项来更改它。在你的自定义函数中,你可以使用一个条件来移动一种类型的消息,而保留其他所有内容的默认位置。