Question

我们希望使用simple_form将第一个单选按钮包装器应用于大多数无线电。我们在simple_form配置中已经这样做了。

config.wrapper_mappings = {
 radio_buttons: :wrapped_radio_buttons
}

第一个电台课程：

config.wrappers(
 :wrapped_radio_buttons,
 class: "field-unit radio-buttons",
 error_class: "field-with-errors"
) do |b|
 b.use :error, wrap_with: { tag: "span", class: "field-error" }
 b.use :label_input
end

我们希望将第二个无线电包装应用于其他一些无线电：

config.wrappers(
 :wrapped_radio_blocks,
 class: "field-unit radio-buttons radio-block-group",
 error_class: "field-with-errors"
) do |b|
  b.use :label
  b.use :error, wrap_with: { tag: "span", class: "field-error" }
  b.wrapper tag: "div", class: "radio-blocks" do |ba|
   ba.use :input
  end
end

我们尝试为第二个选项添加配置包装器映射，但似乎只能为每个html输入类型应用一个包装器。我们如何将第二个包装器应用于某些无线电？

这是我们的HTML：

<%= f.input(
  :fake_input,
  as: :radio_buttons,
  collection: t(
    [
      :radio_option_one,
      :radio_option_two,
      :radio_option_three,
      :radio_option_four,
      :radio_option_five,
    ],
    scope: "fake_scope",
  )
) %>

我们希望用第二个包装类型的不同行替换as: :radio_buttons。

Answer 1

好吧，我们在使用collection_wrapper_tag and collection_wrapper_class解决方法发布后不久就解决了这个问题，而不是创建一个全新的simple_form自定义包装器。

<%= f.input(
  :regular_radio_example,
  as: :radio_buttons,
  collection: t(
    [
      :radio_option_one,
      :radio_option_two,
      :radio_option_three,
      :radio_option_four,
      :radio_option_five,
    ],
    scope: "fake_scope",
  ),
) %>

<%= f.input(
  :new_cool_radio_example,
  as: :radio_buttons,
  wrapper_html: { class: "radio-block-group" },
  collection: t(
    [
      :radio_option_one,
      :radio_option_two,
      :radio_option_three,
      :radio_option_four,
      :radio_option_five,
    ],
    scope: "fake_scope",
  ),
  collection_wrapper_tag: "div",
  collection_wrapper_class: "radio-blocks",
) %>

将一个simple_form自定义包装器应用于某些单选按钮，但为其他单选按钮应用不同的包装器

1 个答案: