From e6b8c70149d78d80633df5aa01bbdc0793059c19 Mon Sep 17 00:00:00 2001 From: Larry Reid Date: Sun, 15 Apr 2018 14:57:50 -0700 Subject: [PATCH 1/3] Allow .form-row to replace .row in div.form-group. --- UPGRADE-4.0.md | 20 ++++++++++++++++++++ lib/bootstrap_form/form_builder.rb | 3 ++- test/bootstrap_fields_test.rb | 13 +++++++++++++ test/bootstrap_form_group_test.rb | 15 +++++++++++++++ 4 files changed, 50 insertions(+), 1 deletion(-) create mode 100644 UPGRADE-4.0.md diff --git a/UPGRADE-4.0.md b/UPGRADE-4.0.md new file mode 100644 index 000000000..8e195bbe3 --- /dev/null +++ b/UPGRADE-4.0.md @@ -0,0 +1,20 @@ +## `form-group` and Horizontal Forms +In Bootstrap 3, `.form-group` mixed in `.row`. In Bootstrap 4, it doesn't. So `bootstrap_form` automatically adds `.row` to the `div.form-group`s that it creates, if the form group is in a horizontal layout. When migrating forms from the Bootstrap 3 version of `bootstrap_form` to the Bootstrap 4 version, check all horizontal forms to be sure they're being rendered properly. + +Bootstrap 4 also provides a `.form-row`, which has smaller gutters than `.row`. If you specify ".form-row", `bootstrap_form` will replace `.row` with `.form-row` on the `div.form-group`. When calling `form_group` directly, do something like this: +``` +bootstrap_form_for(@user, layout: "horizontal") do |f| + f.form_group class: "form-row" do + ... + end +end +``` +For the other helpers, do something like this: +``` +bootstrap_form_for(@user, layout: "horizontal") do |f| + f.form_group class: "form-row" do + f.text_field wrapper_class: "form-row" # or f.text_field wrapper: { class: "form-row" } + ... + end +end +``` diff --git a/lib/bootstrap_form/form_builder.rb b/lib/bootstrap_form/form_builder.rb index dae4de2d2..0164e4843 100644 --- a/lib/bootstrap_form/form_builder.rb +++ b/lib/bootstrap_form/form_builder.rb @@ -246,7 +246,8 @@ def form_group(*args, &block) name = args.first options[:class] = ["form-group", options[:class]].compact.join(' ') - options[:class] << " row" if get_group_layout(options[:layout]) == :horizontal + options[:class] << " row" if get_group_layout(options[:layout]) == :horizontal && + !options[:class].split.include?("form-row") options[:class] << " form-inline" if field_inline_override?(options[:layout]) options[:class] << " #{feedback_class}" if options[:icon] diff --git a/test/bootstrap_fields_test.rb b/test/bootstrap_fields_test.rb index 04e2df629..a26d544f4 100644 --- a/test/bootstrap_fields_test.rb +++ b/test/bootstrap_fields_test.rb @@ -225,6 +225,19 @@ class BootstrapFieldsTest < ActionView::TestCase assert_equivalent_xml expected, @builder.text_field(:email) end + test "text fields are wrapped correctly when horizontal and form-row given" do + expected = <<-HTML.strip_heredoc +
+ +
+ +
+
+ HTML + assert_equivalent_xml expected, @horizontal_builder.text_field(:email, wrapper_class: "form-row") + assert_equivalent_xml expected, @horizontal_builder.text_field(:email, wrapper: { class: "form-row" }) + end + test "field 'id' attribute is used to specify label 'for' attribute" do expected = <<-HTML.strip_heredoc
diff --git a/test/bootstrap_form_group_test.rb b/test/bootstrap_form_group_test.rb index 24d11d9cf..a484ad751 100644 --- a/test/bootstrap_form_group_test.rb +++ b/test/bootstrap_form_group_test.rb @@ -343,6 +343,21 @@ class BootstrapFormGroupTest < ActionView::TestCase assert_equivalent_xml expected, output end + test "form_group horizontal lets caller override .row" do + output = @horizontal_builder.form_group class: "form-row" do + %{}.html_safe + end + + expected = <<-HTML.strip_heredoc +
+
+ +
+
+ HTML + assert_equivalent_xml expected, output + end + test "form_group overrides the label's 'class' and 'for' attributes if others are passed" do output = @horizontal_builder.form_group nil, label: { text: 'Custom Control', class: 'foo', for: 'bar' } do %{}.html_safe From 57d48ad72329b70540de5c90fe9c2fb75dd74ff6 Mon Sep 17 00:00:00 2001 From: Larry Reid Date: Sun, 15 Apr 2018 17:34:43 -0700 Subject: [PATCH 2/3] Update CHANGELOG. --- CHANGELOG.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e29b499e6..36afd9955 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,6 +20,7 @@ In addition to these necessary markup changes, the bootstrap_form API itself has * `static_control` will also no longer accept a block, use the `value` option instead. * Your contribution here! * [#456](https://github.com/bootstrap-ruby/bootstrap_form/pull/456): Fix label `for` attribute when passing non-english characters using `collection_check_boxes` - [@ug0](https://github.com/ug0). +* [#449](https://github.com/bootstrap-ruby/bootstrap_form/pull/449): Bootstrap 4 no longer mixes in `.row` in `.form-group`. 'bootstrap_form` adds `.row` to `div.form-group` when layout is horizontal. ### New features @@ -29,6 +30,7 @@ In addition to these necessary markup changes, the bootstrap_form API itself has * [#408](https://github.com/bootstrap-ruby/bootstrap_form/pull/408): Add option[:id] on static control #245 - [@duleorlovic](https://github.com/duleorlovic). * [#455](https://github.com/bootstrap-ruby/bootstrap_form/pull/455): Support for i18n `:html` subkeys in help text - [@jsaraiva](https://github.com/jsaraiva). * Adds support for `label_as_placeholder` option, which will set the label text as an input fields placeholder (and hiding the label for sr_only). +* [#449](https://github.com/bootstrap-ruby/bootstrap_form/pull/449): Passing `.form-row` overrides default `.form-group.row` in horizontal layouts. * Your contribution here! ### Bugfixes From 35a9e3523466a143f203a236b6b5e83245917720 Mon Sep 17 00:00:00 2001 From: Matt Brictson Date: Mon, 28 May 2018 16:51:08 -0700 Subject: [PATCH 3/3] Fix typo --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 36afd9955..b1ab6b572 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,7 +20,7 @@ In addition to these necessary markup changes, the bootstrap_form API itself has * `static_control` will also no longer accept a block, use the `value` option instead. * Your contribution here! * [#456](https://github.com/bootstrap-ruby/bootstrap_form/pull/456): Fix label `for` attribute when passing non-english characters using `collection_check_boxes` - [@ug0](https://github.com/ug0). -* [#449](https://github.com/bootstrap-ruby/bootstrap_form/pull/449): Bootstrap 4 no longer mixes in `.row` in `.form-group`. 'bootstrap_form` adds `.row` to `div.form-group` when layout is horizontal. +* [#449](https://github.com/bootstrap-ruby/bootstrap_form/pull/449): Bootstrap 4 no longer mixes in `.row` in `.form-group`. `bootstrap_form` adds `.row` to `div.form-group` when layout is horizontal. ### New features