Question

我在视图中遇到以下代码的问题：

<div class="btn-group" data-toggle="buttons">
  <%= f.label :private, class: "btn btn-default" do %>
    <%= f.check_box :private %> Private
  <% end %>
</div>

从技术上讲它可行，但是当private字段最初为真（即已选中）时，该按钮看起来好像是未选中的。也许是因为check_box助手生成了两个输入，其中一个是隐藏的。

有人可以在Rails视图中显示Bootstrap checkboxes的示例实现吗？

Answer 1

事实证明，Bootstrap脚本不会在页面加载时更新状态。所以我用这个JavaScript代码片段解决了它：

$("[data-toggle='buttons'] .btn").each(function(i, el) {
  var $button = $(el);
  var checked = $button.find("input[type='checkbox']").prop("checked");
  if (checked) {
    $button.addClass("active");
  } else {
    $button.removeClass("active");
  }
});

Answer 2

这是使用Simple Form生成的一个项目的工作复选框：

<%= f.input :cost, label: "Cost to access resource" %>

生成：

<div class="form-group boolean optional archive_resource_cost">
   <input name="archive_resource[cost]" type="hidden" value="0" />
   <label class="boolean optional checkbox" for="archive_resource_cost">
   <input checked="checked" class="boolean optional" id="archive_resource_cost" name="archive_resource[cost]" type="checkbox" value="1" />
      Cost to access resource
   </label>
</div>

您的:private模型属性肯定是boolean吗？

如何获取最初检查类似Bootstrap按钮的复选框？

2 个答案: