从辅助功能的角度来看,将fieldset/legend
组合用于单选按钮和复选框非常重要:
fieldset
legend What is your sex?
label for="male" Male
input type="radio" id="male"
label for="female" Female
input type="radio" id="female"
当已经在fieldset/legend
对内时,情况就是如此:
fieldset
legend Personal information
label for="name"
input type="text" id="name"
fieldset // Yes, this is a fieldset inside a fieldset!
legend What is your sex?
label for="male" Male
input type="radio" id="male"
label for="female" Female
input type="radio" id="female"
label for="email"
input type="text" id="email"
Simple_Form会自动为这些图例生成label
个元素。是否有一种简单的方法可以告诉Simple_Form创建fieldset/legend
,还是我必须使用自定义包装器解决这个问题?
更新
首先,我创建了一个自定义包装器,如下所示:
config.wrappers :vertical_radio_and_checkboxes, tag: 'fieldset', class: 'form-group', error_class: 'has-error' do |b|
b.use :html5
b.optional :readonly
b.wrapper tag: 'legend', class: 'col-sm-3 control-label' do |ba|
ba.use :label # TODO: Doesn't need to be a label tag, see http://stackoverflow.com/questions/29261556/simple-form-use-fieldset-legend-for-radio-buttons-checkboxes
end
b.wrapper tag: 'div', class: 'col-sm-9' do |ba|
ba.use :input
ba.use :error, wrap_with: { tag: 'span', class: 'help-block' }
ba.use :hint, wrap_with: { tag: 'p', class: 'help-block' }
end
end
暂时没关系,虽然我没有找到告诉Simple_Form不为标签生成label
元素的方法(它没有指向任何ID,这意味着它可以无论如何都是正确的用法,但它添加了一些重要的CSS类,所以我不想放弃它并使用label_text
)。
我在Simple_Form-Bootstrap repo中添加了一个问题:fieldset/legend should be used for multiple checkboxes/radiobuttons。
答案 0 :(得分:0)
要阻止生成simple_form <label>
,您可以使用:label => false
例如在_form.haml
:
= f.input :name, :label => false
在您的表单中。
这是你想要达到的目标吗?不确定这完全是你的问题所在。
以防万一,可能会有一些有用的信息here