Fix table formset checkbox (#107)

* Remove empty divs for checkboxes when rendering table_inline_formsets * Fix tests accordingly
django-crispy-forms · Jun 6, 2022 · b775ef2 · b775ef2
1 parent 193ba81
commit b775ef2
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 19 deletions.
diff --git a/crispy_bootstrap5/templates/bootstrap5/field.html b/crispy_bootstrap5/templates/bootstrap5/field.html
@@ -3,7 +3,7 @@
 {% if field.is_hidden %}
     {{ field }}
 {% else %}
-    {% if field|is_checkbox %}
+    {% if field|is_checkbox and tag != "td" %}
         <div class="mb-3{% if 'form-horizontal' in form_class %} row{% endif %}">
         {% if label_class %}
             <div class="{% for offset in bootstrap_checkbox_offsets %}{{ offset|slice:"7:14" }}{{ offset|slice:"4:7" }}{{ offset|slice:"14:16" }} {% endfor %}{{ field_class }}">
@@ -60,7 +60,7 @@
             {% endif %}
         {% endif %}
     </{% if tag %}{{ tag }}{% else %}div{% endif %}>
-    {% if field|is_checkbox %}
+    {% if field|is_checkbox and tag != "td" %}
         {% if label_class %}
             </div>
         {% endif %}

diff --git a/tests/results/test_tabular_formset_layout.html b/tests/results/test_tabular_formset_layout.html
@@ -23,11 +23,9 @@
     </thead>
     <tbody>
     <tr class="d-none empty-form">
-        <div class="mb-3">
         <td id="div_id_form-__prefix__-is_company" class="mb-3"> <input type="checkbox"
             name="form-__prefix__-is_company" class="checkboxinput form-check-input"
             id="id_form-__prefix__-is_company"> </td>
-        </div>
         <td id="div_id_form-__prefix__-email" class="mb-3"> <input type="text" name="form-__prefix__-email"
             maxlength="30" class="textinput textInput inputtext form-control" id="id_form-__prefix__-email"> <small
             id="hint_id_form-__prefix__-email" class="form-text text-muted">Insert your email</small> </td>
@@ -47,10 +45,8 @@
             class="timeinput form-control" id="id_form-__prefix__-datetime_field_1"> </td>
     </tr>
     <tr>
-        <div class="mb-3">
         <td id="div_id_form-0-is_company" class="mb-3"> <input type="checkbox" name="form-0-is_company"
             class="checkboxinput form-check-input" id="id_form-0-is_company"> </td>
-        </div>
         <td id="div_id_form-0-email" class="mb-3"> <input type="text" name="form-0-email" maxlength="30"
             class="textinput textInput inputtext form-control" id="id_form-0-email"> <small id="hint_id_form-0-email"
             class="form-text text-muted">Insert your email</small> </td>
@@ -67,10 +63,8 @@
             name="form-0-datetime_field_1" class="timeinput form-control" id="id_form-0-datetime_field_1"> </td>
     </tr>
     <tr>
-        <div class="mb-3">
         <td id="div_id_form-1-is_company" class="mb-3"> <input type="checkbox" name="form-1-is_company"
             class="checkboxinput form-check-input" id="id_form-1-is_company"> </td>
-        </div>
         <td id="div_id_form-1-email" class="mb-3"> <input type="text" name="form-1-email" maxlength="30"
             class="textinput textInput inputtext form-control" id="id_form-1-email"> <small id="hint_id_form-1-email"
             class="form-text text-muted">Insert your email</small> </td>
@@ -87,10 +81,8 @@
             name="form-1-datetime_field_1" class="timeinput form-control" id="id_form-1-datetime_field_1"> </td>
     </tr>
     <tr>
-        <div class="mb-3">
         <td id="div_id_form-2-is_company" class="mb-3"> <input type="checkbox" name="form-2-is_company"
             class="checkboxinput form-check-input" id="id_form-2-is_company"> </td>
-        </div>
         <td id="div_id_form-2-email" class="mb-3"> <input type="text" name="form-2-email" maxlength="30"
             class="textinput textInput inputtext form-control" id="id_form-2-email"> <small id="hint_id_form-2-email"
             class="form-text text-muted">Insert your email</small> </td>

diff --git a/tests/results/test_tabular_formset_layout_failing.html b/tests/results/test_tabular_formset_layout_failing.html
@@ -23,11 +23,9 @@
         </thead>
         <tbody>
             <tr class="d-none empty-form">
-                <div class="mb-3">
-                    <td class="mb-3" id="div_id_form-__prefix__-is_company"><input
-                            class="checkboxinput form-check-input" id="id_form-__prefix__-is_company"
-                            name="form-__prefix__-is_company" type="checkbox"></td>
-                </div>
+                <td class="mb-3" id="div_id_form-__prefix__-is_company"><input
+                        class="checkboxinput form-check-input" id="id_form-__prefix__-is_company"
+                        name="form-__prefix__-is_company" type="checkbox"></td>
                 <td class="mb-3" id="div_id_form-__prefix__-email"><input
                         class="form-control inputtext textInput textinput" id="id_form-__prefix__-email" maxlength="30"
                         name="form-__prefix__-email" type="text"><small class="form-text text-muted"
@@ -55,10 +53,8 @@
                 </ul>
             </div>
             <tr>
-                <div class="mb-3">
-                    <td class="mb-3" id="div_id_form-0-is_company"><input class="checkboxinput form-check-input"
-                            id="id_form-0-is_company" name="form-0-is_company" type="checkbox"></td>
-                </div>
+                <td class="mb-3" id="div_id_form-0-is_company"><input class="checkboxinput form-check-input"
+                        id="id_form-0-is_company" name="form-0-is_company" type="checkbox"></td>
                 <td class="mb-3" id="div_id_form-0-email"><input
                         class="form-control inputtext is-invalid textInput textinput" id="id_form-0-email"
                         maxlength="30" name="form-0-email" type="text"><span class="invalid-feedback"