collection_check_boxes = collection_check_boxes

Question

如果用户检查或取消选中:committed天，我们如何自动将send_email collection_check_boxes与:committed {中目前已检查或未选中的内容进行匹配{1}}？

例如，如果用户检查＆＃34; sun＆＃34;并且取消选择＆＃34; fri＆＃34;在collection_check_boxes中，这些更改也会反映在committed。

中

但反之亦然。

例如，如果用户更改了:send_email的选中天数，则javascript不会生效。 send_email只应在直接联系时发生变化。

:committed

感谢javascript好友！

Answer 1

假设每个复选框集合具有相同的值（星期一和星期一），您可以将每个复选框集合分组为div。

<div class="committed-check-boxes">
  <%= f.collection_check_boxes :committed, Date::ABBR_DAYNAMES, :downcase, :to_s, checked: ["mon", "tue", "wed", "thu", "fri"] %>
</div>

<div class="send-email-check-boxes">
  <%= f.collection_check_boxes :send_email, Date::ABBR_DAYNAMES, :downcase, :to_s, checked: ["mon", "tue", "wed", "thu", "fri"] %>
</div>

只收听.committed-check-boxes div的点击次数。找到.send-email-check-boxes中的匹配复选框，然后使用prop将选中设置为true / false。

<script>
  $('.committed-check-boxes input[type="checkbox"]').on('click', function() {
    var checkbox = $(this);

    $('.send-email-check-boxes')
      .find('input[value="' + checkbox.val() + '"]')
      .prop('checked', checkbox.prop('checked'));
  });
</script>