resolve radio ID duplication and error display in Bootstrap 4

refs #156
level12 · Dec 7, 2022 · 74b7215 · 74b7215
1 parent 4d67937
commit 74b7215
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/keg_elements/templates/keg-elements/forms/horizontal-b3.html b/keg_elements/templates/keg-elements/forms/horizontal-b3.html
@@ -160,7 +160,7 @@
                 <label>
                     <input type="radio"
                            name="{{ field.id }}"
-                           id="{{ field.id }}"
+                           id="{{ field.id }}-{{ value | lower }}"
                            value="{{ value }}"
                            {{ 'checked' if checked }}
                            {{ 'disabled' if field.flags.disabled or (field.flags.readonly and not checked) }}

diff --git a/keg_elements/templates/keg-elements/forms/horizontal-b4.html b/keg_elements/templates/keg-elements/forms/horizontal-b4.html
@@ -182,19 +182,19 @@
         {% for value, label, checked in field.iter_choices() %}
             <div class="radio form-check">
                 <input type="radio"
-                    class=""form-check-input"
+                    class="form-check-input{{' is-invalid' if field.errors }}"
                     name="{{ field.id }}"
-                    id="{{ field.id }}"
+                    id="{{ field.id }}-{{ value | lower }}"
                     value="{{ value }}"
                     {{ 'checked' if checked }}
                     {{ 'disabled' if field.flags.disabled or (field.flags.readonly and not checked) }}
                     tabIndex="{{tabIndex}}">
                 <label class="form-check-label">
                     {{ label }}
                 </label>
+                {% if loop.last %}{{ field_errors(field) }}{% endif %}
             </div>
         {% endfor %}
-        {{ field_errors(field) }}
         </div>
         {% if field.description %}
             {{ description(field) }}