简单格式更改dom输出以进行关联

如何解决简单格式更改dom输出以进行关联

我正在为我的网站使用主题，而我正尝试使用类似的主题（主题的工作原理并不完美……）

<div class="input-checkBox input-checkBox--switch">
  <input name="agree" type="checkBox">/</input>
  <label for="checkBox-switch"></label>
</div>
<span>Helper text for checkBox</span>

当前，我正在使用这种简单形式

= simple_form_for current_user.shop do |f|
  = f.error_notification
  = f.association :services,collection: Service.active.order(:name),as: :check_Boxes

输出为：

<div class="input-checkBox input-checkBox--switch">
  <input class="form-check-input check_Boxes optional" type="checkBox" value="7" name="shop[service_ids][]" id="shop_service_ids_7">
  <label class="form-check-label collection_check_Boxes" for="shop_service_ids_7">Service 1</label>
</div>

因此，我需要将全局包装器之后的文本标签放入span标签中，并从<label>标签中删除文本。

我尝试了很多事情，但是我迷失了包装，输入，simple_form的构建器

解决方法

如果您确实必须生成该标记，则可以使用collection_checkboxes内置的Rails帮助程序来完成。

= f.collection_checkboxes :service_ids,@services,:id,:name do |b|
  = f.input :services # adds the simple form wrapper  
    = b.label ""
    = b.check_box
  span b.text 

但是我真的会解决这个问题，因为这会引起巨大的配件问题，因为屏幕阅读器将无法读取标签，在验收测试中您将无法使用Capybara定位标签文本，对于一个简单的CSS或JS问题，感觉就像是一个荒谬的解决方案。

请参见Wrapping Rails Form Helpers。

,

灵感来自Max的答案：

= f.collection_check_boxes :service_ids,:name do |b|
  .input-checkbox.input-checkbox--switch
    = b.check_box
    = label_tag b,'',{ for: "shop_service_ids_#{b.value}" }
   %span= b.text