diff --git a/lib/bootstrap_form/form_builder.rb b/lib/bootstrap_form/form_builder.rb index bcc70c66d..81470463c 100644 --- a/lib/bootstrap_form/form_builder.rb +++ b/lib/bootstrap_form/form_builder.rb @@ -134,7 +134,7 @@ def check_box_with_bootstrap(name, options = {}, checked_value = "1", unchecked_ if options[:custom] div_class = ["custom-control", "custom-checkbox"] - div_class.append("custom-control-inline") if options[:inline] + div_class.append("custom-control-inline") if layout_inline?(options[:inline]) label_class = label_classes.prepend("custom-control-label").compact.join(" ") content_tag(:div, class: div_class.compact.join(" ")) do if options[:skip_label] @@ -146,7 +146,7 @@ def check_box_with_bootstrap(name, options = {}, checked_value = "1", unchecked_ end else wrapper_class = "form-check" - wrapper_class += " form-check-inline" if options[:inline] + wrapper_class += " form-check-inline" if layout_inline?(options[:inline]) label_class = label_classes.prepend("form-check-label").compact.join(" ") content_tag(:div, class: wrapper_class) do if options[:skip_label] @@ -182,7 +182,7 @@ def radio_button_with_bootstrap(name, value, *args) if options[:custom] div_class = ["custom-control", "custom-radio"] - div_class.append("custom-control-inline") if options[:inline] + div_class.append("custom-control-inline") if layout_inline?(options[:inline]) label_class = label_classes.prepend("custom-control-label").compact.join(" ") content_tag(:div, class: div_class.compact.join(" ")) do if options[:skip_label] @@ -194,7 +194,7 @@ def radio_button_with_bootstrap(name, value, *args) end else wrapper_class = "form-check" - wrapper_class += " form-check-inline" if options[:inline] + wrapper_class += " form-check-inline" if layout_inline?(options[:inline]) label_class = label_classes.prepend("form-check-label").compact.join(" ") content_tag(:div, class: "#{wrapper_class}#{disabled_class}") do if options[:skip_label] @@ -233,6 +233,7 @@ def form_group(*args, &block) options[:class] = ["form-group", options[:class]].compact.join(' ') options[:class] << " row" if get_group_layout(options[:layout]) == :horizontal + options[:class] << " form-inline" if field_inline_override?(options[:layout]) options[:class] << " #{feedback_class}" if options[:icon] content_tag(:div, options.except(:id, :label, :help, :icon, :label_col, :control_col, :layout)) do @@ -274,8 +275,28 @@ def fields_for_with_bootstrap(record_name, record_object = nil, fields_options = private - def horizontal? - layout == :horizontal + def layout_default?(field_layout = nil) + [:default, nil].include? layout_in_effect(field_layout) + end + + def layout_horizontal?(field_layout = nil) + layout_in_effect(field_layout) == :horizontal + end + + def layout_inline?(field_layout = nil) + layout_in_effect(field_layout) == :inline + end + + def field_inline_override?(field_layout = nil) + field_layout == :inline && layout != :inline + end + + # true and false should only come from check_box and radio_button, + # and those don't have a :horizontal layout + def layout_in_effect(field_layout) + field_layout = :inline if field_layout == true + field_layout = :default if field_layout == false + field_layout || layout end def get_group_layout(group_layout) @@ -411,9 +432,11 @@ def generate_label(id, name, options, custom_label_col, group_layout) options[:for] = id if acts_like_form_tag classes = [options[:class]] - if get_group_layout(group_layout) == :horizontal + if layout_horizontal?(group_layout) classes << "col-form-label" classes << (custom_label_col || label_col) + elsif layout_inline?(group_layout) + classes << "mr-sm-2" end unless options.delete(:skip_required) @@ -452,6 +475,7 @@ def get_error_messages(name) end def inputs_collection(name, collection, value, text, options = {}, &block) + options[:inline] ||= layout_inline?(options[:layout]) form_group_builder(name, options) do inputs = "" diff --git a/test/bootstrap_fields_test.rb b/test/bootstrap_fields_test.rb index 8a7bae8ac..2e39aca67 100644 --- a/test/bootstrap_fields_test.rb +++ b/test/bootstrap_fields_test.rb @@ -310,7 +310,7 @@ class BootstrapFieldsTest < ActionView::TestCase
- +
diff --git a/test/bootstrap_form_group_test.rb b/test/bootstrap_form_group_test.rb index 9f0714802..2789dd957 100644 --- a/test/bootstrap_form_group_test.rb +++ b/test/bootstrap_form_group_test.rb @@ -458,8 +458,8 @@ class BootstrapFormGroupTest < ActionView::TestCase expected = <<-HTML.strip_heredoc
-
- +
+
diff --git a/test/bootstrap_form_test.rb b/test/bootstrap_form_test.rb index 0a930c22a..5e15c7584 100644 --- a/test/bootstrap_form_test.rb +++ b/test/bootstrap_form_test.rb @@ -14,6 +14,107 @@ class BootstrapFormTest < ActionView::TestCase assert_equivalent_xml expected, bootstrap_form_for(@user) { |f| nil } end + test "default-style form fields layout horizontal" do + expected = <<-HTML.strip_heredoc +
+ +
+ +
+ +
+
+
+ + + +
+
+ +
+
+ + +
+
+ + +
+
+
+
+ +
+ +
+
+
+ HTML + + collection = [Address.new(id: 1, street: 'Foo'), Address.new(id: 2, street: 'Bar')] + actual = bootstrap_form_for(@user) do |f| + f.email_field(:email, layout: :horizontal) + .concat(f.check_box(:terms, label: 'I agree to the terms')) + .concat(f.collection_radio_buttons(:misc, collection, :id, :street, layout: :horizontal)) + .concat(f.select(:status, [['activated', 1], ['blocked', 2]], layout: :horizontal)) + end + + assert_equivalent_xml expected, actual + # See the rendered output at: https://www.bootply.com/S2WFzEYChf + end + + test "default-style form fields layout inline" do + expected = <<-HTML.strip_heredoc +
+ +
+ + +
+
+ + + +
+
+ +
+ + +
+
+ + +
+
+
+ + +
+
+ HTML + + collection = [Address.new(id: 1, street: 'Foo'), Address.new(id: 2, street: 'Bar')] + actual = bootstrap_form_for(@user) do |f| + f.email_field(:email, layout: :inline) + .concat(f.check_box(:terms, label: 'I agree to the terms', inline: true)) + .concat(f.collection_radio_buttons(:misc, collection, :id, :street, layout: :inline)) + .concat(f.select(:status, [['activated', 1], ['blocked', 2]], layout: :inline)) + end + + assert_equivalent_xml expected, actual + # See the rendered output at: https://www.bootply.com/fH5sF4fcju + # Note that the baseline of the label text to the left of the two radio buttons + # isn't aligned with the text of the radio button labels. + # TODO: Align baseline better. + end + if ::Rails::VERSION::STRING >= '5.1' # No need to test 5.2 separately for this case, since 5.2 does *not* # generate a default ID for the form element. @@ -31,9 +132,45 @@ class BootstrapFormTest < ActionView::TestCase expected = <<-HTML.strip_heredoc
+
+ + +
+
+ + + +
+
+ +
+ + +
+
+ + +
+
+
+ + +
HTML - assert_equivalent_xml expected, bootstrap_form_for(@user, layout: :inline) { |f| nil } + + collection = [Address.new(id: 1, street: 'Foo'), Address.new(id: 2, street: 'Bar')] + actual = bootstrap_form_for(@user, layout: :inline) do |f| + f.email_field(:email) + .concat(f.check_box(:terms, label: 'I agree to the terms')) + .concat(f.collection_radio_buttons(:misc, collection, :id, :street)) + .concat(f.select(:status, [['activated', 1], ['blocked', 2]])) + end + + assert_equivalent_xml expected, actual end test "horizontal-style forms" do @@ -46,9 +183,137 @@ class BootstrapFormTest < ActionView::TestCase
+
+ + + +
+
+ +
+
+ + +
+
+ + +
+
+
+
+ +
+ +
+
+ + HTML + + collection = [Address.new(id: 1, street: 'Foo'), Address.new(id: 2, street: 'Bar')] + actual = bootstrap_form_for(@user, layout: :horizontal) do |f| + f.email_field(:email) + .concat(f.check_box(:terms, label: 'I agree to the terms')) + .concat(f.collection_radio_buttons(:misc, collection, :id, :street)) + .concat(f.select(:status, [['activated', 1], ['blocked', 2]])) + end + + assert_equivalent_xml expected, actual + end + + test "horizontal-style form fields layout default" do + expected = <<-HTML.strip_heredoc +
+ +
+ + +
+
+ + + +
+
+ +
+ + +
+
+ + +
+
+
+ + +
HTML - assert_equivalent_xml expected, bootstrap_form_for(@user, layout: :horizontal) { |f| f.email_field :email } + + collection = [Address.new(id: 1, street: 'Foo'), Address.new(id: 2, street: 'Bar')] + actual = bootstrap_form_for(@user, layout: :horizontal) do |f| + f.email_field(:email, layout: :default) + .concat(f.check_box(:terms, label: 'I agree to the terms')) + .concat(f.collection_radio_buttons(:misc, collection, :id, :street, layout: :default)) + .concat(f.select(:status, [['activated', 1], ['blocked', 2]], layout: :default)) + end + + assert_equivalent_xml expected, actual + # See the rendered output at: https://www.bootply.com/4f23be1nLn + end + + test "horizontal-style form fields layout inline" do + expected = <<-HTML.strip_heredoc +
+ +
+ + +
+
+ + + +
+
+ +
+ + +
+
+ + +
+
+
+ + +
+
+ HTML + + collection = [Address.new(id: 1, street: 'Foo'), Address.new(id: 2, street: 'Bar')] + actual = bootstrap_form_for(@user, layout: :horizontal) do |f| + f.email_field(:email, layout: :inline) + .concat(f.check_box(:terms, label: 'I agree to the terms', inline: true)) + .concat(f.collection_radio_buttons(:misc, collection, :id, :street, layout: :inline)) + .concat(f.select(:status, [['activated', 1], ['blocked', 2]], layout: :inline)) + end + + assert_equivalent_xml expected, actual + # See the rendered output here: https://www.bootply.com/Qby9FC9d3u# end test "existing styles aren't clobbered when specifying a form style" do