Skip to content

Commit

Permalink
Document how to generate empty label. Issue #457. (#468)
Browse files Browse the repository at this point in the history
  • Loading branch information
lcreid committed Jun 5, 2018
1 parent fbce97a commit f4d76b5
Show file tree
Hide file tree
Showing 3 changed files with 38 additions and 0 deletions.
15 changes: 15 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -659,6 +659,21 @@ Which outputs:
bootstrap_form follows standard rails conventions so it's i18n-ready. See more
here: http://guides.rubyonrails.org/i18n.html#translations-for-active-record-models

## Other Tips and Edge Cases
By their very nature, forms are extremely diverse. It would be extremely difficult to provide a gem that could handle every need. Here are some tips for handling edge cases.

### Empty But Visible Labels
Some third party plug-ins require an empty but visible label on an input control. The `hide_label` option generates a label that won't appear on the screen, but it's considered invisible and therefore doesn't work with such a plug-in. An empty label (e.g. `""`) causes the underlying Rails helper to generate a label based on the field's attribute's name.

The solution is to use a zero-width character for the label, or some other "empty" HTML. For example:
```
label: "​".html_safe
```
or
```
label: "<span></span>".html_safe
```

## Code Triage page

http://www.codetriage.com/potenza/bootstrap_form
Expand Down
12 changes: 12 additions & 0 deletions test/bootstrap_checkbox_test.rb
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,18 @@ class BootstrapCheckboxTest < ActionView::TestCase
assert_equivalent_xml expected, @builder.check_box(:terms, label: 'I agree to the terms')
end

test "check_box empty label" do
expected = <<-HTML.strip_heredoc
<div class="form-check">
<input name="user[terms]" type="hidden" value="0" />
<input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
<label class="form-check-label" for="user_terms">&#8203;</label>
</div>
HTML
# &#8203; is a zero-width space.
assert_equivalent_xml expected, @builder.check_box(:terms, label: "&#8203;".html_safe)
end

test "disabled check_box has proper wrapper classes" do
expected = <<-HTML.strip_heredoc
<div class="form-check">
Expand Down
11 changes: 11 additions & 0 deletions test/bootstrap_radio_button_test.rb
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,17 @@ class BootstrapRadioButtonTest < ActionView::TestCase
assert_equivalent_xml expected, @builder.radio_button(:misc, '1', label: 'This is a radio button')
end

test "radio_button no label" do
expected = <<-HTML.strip_heredoc
<div class="form-check">
<input class="form-check-input" id="user_misc_1" name="user[misc]" type="radio" value="1" />
<label class="form-check-label" for="user_misc_1">&#8203;</label>
</div>
HTML
# &#8203; is a zero-width space.
assert_equivalent_xml expected, @builder.radio_button(:misc, '1', label: '&#8203;'.html_safe)
end

test "radio_button with error is wrapped correctly" do
@user.errors.add(:misc, "error for test")
expected = <<-HTML.strip_heredoc
Expand Down

0 comments on commit f4d76b5

Please sign in to comment.