在Rails 4中为单选按钮标签使用图像。

Question

我试图使用帮助程序collection_radio_buttons来显示一张图片作为标签，并希望将图片的id保存到模型中，以便我可以检索url，到目前为止，我想出了这样的办法，它显示了一个单选按钮和图片的url作为标签。

我已经注意到，我只能点击一次单选按钮，然后它就一直处于开启状态。

<%= f.collection_radio_buttons(:default_image_id, DefaultImage.all, :id, :image) %>

生成的html看起来是这样的。

<input id="campaign_default_image_id_1" name="campaign[default_image_id]" type="radio" value="1" />
<label for="campaign_default_image_id_1">https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/1/vandals_portfolio.png</label>

我如何正确设置？我可以用image_tag包住标签吗？

编辑

因此，经过更多的研究和尝试拼凑，我现在可以渲染一个图像和一个单选按钮，但该图像是我用Carrierwave上传的默认图像，而不是我想要的调整大小的:小版本。我可以把 :small 版本传过来吗？

<%= f.collection_radio_buttons(:default_image_id, DefaultImage.all, :id, :image) do |b| %>
<%= b.label { image_tag("#{b.text}") + b.radio_button } %>

b.text检索网址

https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/2/ymca_portfolio.png

但我想让它在文件名前加上fancy_box_array，像这样。

https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/2/fancy_box_array_ymca_portfolio.png

用这个新代码生成的html是：

<label for="campaign_default_image_id_1"><img alt="Vandals portfolio" src="https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/1/vandals_portfolio.png" />
<input id="campaign_default_image_id_1" name="campaign[default_image_id]" type="radio" value="1" /></label>

谢谢

Answer 1

有一个好的 参考 在你想做的事情上。试试这样的东西：

f.collection_radio_buttons(:default_image_id, DefaultImage.all, :id, :image) do |b|
  b.label { b.radio_button + image_tag(b.object.image) }
end