Added support to render check boxes and radio buttons in `horizon…

…tal` form
shivam091 · May 21, 2023 · 26f67ae · 26f67ae
1 parent 92091b4
commit 26f67ae
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 11 deletions.
diff --git a/app/assets/stylesheets/rails_bootstrap_form.css b/app/assets/stylesheets/rails_bootstrap_form.css
@@ -1,6 +1,9 @@
 label.is-invalid, .invalid-feedback {
   color: var(--bs-form-invalid-color);
 }
+.invalid-feedback {
+  display: block;
+}
 label.required::after {
   color: var(--bs-form-invalid-color);
   content: "*";

diff --git a/lib/rails_bootstrap_form/bootstrap_form_options.rb b/lib/rails_bootstrap_form/bootstrap_form_options.rb
@@ -104,14 +104,19 @@ class BootstrapFormOptions
     # The default value is `col-form-label`.
     attr_accessor :label_col_class
 
-    # CSS class for label column when using horizontal form.
+    # Default CSS class for label column when using horizontal form.
     # The default value is `col-sm-2`.
     attr_accessor :label_col_wrapper_class
 
-    # CSS class for control column when using horizontal form.
+    # Default CSS class for control column when using horizontal form.
     # The default value is `col-sm-10`.
+    attr_accessor :field_col_wrapper_class
+
+    # Default CSS class for adding offset to the fields when using horizontal
+    # form.
+    # The default value is `offset-sm-2`
+    attr_accessor :field_offset_class
 
-    attr_accessor :control_col_wrapper_class
     # Option to render checkboxes and radio buttons inline.
     # The default value if `false`.
     #
@@ -145,7 +150,7 @@ def inline?
     # to a given form field. For example, we can change grid just for one field:
     #
     #   bootstrap_form_with model: @user do |f|
-    #     f.text_field :email, bootstrap_form: {label_col_wrapper_class: "col-md-6", control_col_wrapper_class: "col-md-6"}
+    #     f.text_field :email, bootstrap_form: {label_col_wrapper_class: "col-md-6", field_col_wrapper_class: "col-md-6"}
     #     f.password_field :password
     #   end
     #
@@ -188,8 +193,9 @@ def set_defaults
 
       @label_col_class = "col-form-label"
       @label_col_wrapper_class = "col-sm-2"
-      @control_col_wrapper_class = "col-sm-10"
-
+      @field_col_wrapper_class = "col-sm-10"
+      @field_offset_class = "offset-sm-2"
+
       @inline = false
     end
 

diff --git a/lib/rails_bootstrap_form/field_wrapper_builder.rb b/lib/rails_bootstrap_form/field_wrapper_builder.rb
@@ -19,7 +19,7 @@ def field_wrapper(attribute, bootstrap_options, options, &block)
       if bootstrap_options.layout_horizontal?
         tag.div(**field_wrapper_options(bootstrap_options)) do
           concat(label)
-          concat(tag.div(class: bootstrap_options.control_col_wrapper_class) do
+          concat(tag.div(class: bootstrap_options.field_col_wrapper_class) do
             concat(input_group_wrapper(attribute, bootstrap_options) do
               capture(&block)
             end)

diff --git a/lib/rails_bootstrap_form/inputs.rb b/lib/rails_bootstrap_form/inputs.rb
@@ -141,10 +141,21 @@ def check_box(attribute, options = {}, checked_value = "1", unchecked_value = "0
         concat(check_box_field)
         concat(check_box_label)
         concat(check_box_help_text) unless bootstrap_options.inline?
-        concat(generate_error(attribute)) if is_invalid?(attribute) && !bootstrap_options.inline?
+        concat(generate_error(attribute)) if (is_invalid?(attribute) && !bootstrap_options.inline?)
       end
 
-      check_box_html
+      if (bootstrap_options.inline? || bootstrap_options.layout_vertical?)
+        check_box_html
+      else
+        check_box_container_classes = [bootstrap_options.field_col_wrapper_class]
+        check_box_container_classes << bootstrap_options.field_offset_class unless bootstrap_options.inline?
+
+        tag.div(class: field_wrapper_classes(bootstrap_options)) do
+          tag.div(class: check_box_container_classes) do
+            check_box_html
+          end
+        end
+      end
     end
 
     def radio_button(attribute, value, options = {})
@@ -161,10 +172,21 @@ def radio_button(attribute, value, options = {})
         concat(radio_button_field)
         concat(radio_button_label)
         concat(radio_button_help_text) unless bootstrap_options.inline?
-        concat(generate_error(attribute)) if is_invalid?(attribute) && !bootstrap_options.inline?
+        concat(generate_error(attribute)) if (is_invalid?(attribute) && !bootstrap_options.inline?)
       end
 
-      radio_button_html
+      if (bootstrap_options.inline? || bootstrap_options.layout_vertical?)
+        radio_button_html
+      else
+        radio_button_container_classes = [bootstrap_options.field_col_wrapper_class]
+        radio_button_container_classes << bootstrap_options.field_offset_class unless bootstrap_options.inline?
+
+        tag.div(class: field_wrapper_classes(bootstrap_options)) do
+          tag.div(class: radio_button_container_classes) do
+            radio_button_html
+          end
+        end
+      end
     end
 
     def collection_check_boxes(attribute, collection, value_method, text_method, options = {}, html_options = {}, &block)