css - 实现 css 复选框在 Rails 应用程序中不起作用

标签 css ruby-on-rails checkbox gem materialize

我正在尝试向表单添加复选框,供用户选择他们想要的研讨会,但我无法显示复选框。我正在使用带有 rails 的 Materialise Css gem。

我的表格是下一个:

<div class="row">
  <% workshops = Workshop.all.order("date") %>
  <% workshops.each do |workshop| %>
    <div class=" col m4 s6">
      <%= f.label "#{workshop.name} \n\r #{workshop.date}", for:"workshop_id", id:"workshop_id" %>
      <%= f.check_box :workshop_id, id:"workshop_id" %>
    </div>
  <% end %>  
  <div class="actions col m6 s12">
    <br>
    <br>
    <br>
    <%= f.submit "Save", class:"btn green"%> 
  </div>
</div>

我试过使用和不使用 id 输入和标签中的属性,但似乎没有任何效果。
我错过了什么吗?

编辑 1

Materialize css 显示的 css 如下:
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
    visibility: hidden;
}

最佳答案

解决方案,就这么简单... 是更改 <input> 的顺序和 <label>
所以而不是:

<%= f.label "#{workshop.name} \n\r #{workshop.date}", for:"workshop_id", id:"workshop_id" %>`
<%= f.check_box :workshop_id, id:"workshop_id" %>`

正确的做法是:
<%= f.check_box :workshop_id, id:"workshop_id" %>
<%= f.label "#{workshop.name} \n\r #{workshop.date}", for:"workshop_id", id:"workshop_id" %>

解决了。

关于css - 实现 css 复选框在 Rails 应用程序中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33109410/

相关文章:

css - 获取在导航中的图像下方显示的文本

python - 'lessc' 不是内部或外部命令,也不是可运行的程序 或批处理文件

css - 根据绝对位置后代扩展 div 元素的高度

css - 字形图标没有全部显示出来,而且显示的字形很小

Javascript 复选框检查

javascript - 如何使用 JS 和 CSS 在 html 中显示鼠标悬停弹出窗口?

javascript - :remote => true creating unknown format?

ruby-on-rails - 使用haml和rails3时遇到问题

jquery - 在选中的复选框上隐藏表格行

java - 如何将动态更改的文本框值存储为复选框值?