CODEWITHSUNDEEP
htmldjangodjango-formsdjango-templates
quanuw
quanuw

Reputation: 51

Django unable to render form in table format

I have a django formset and I am trying to render it row by row. Instead, the form is being render column by column (like a vertical form instead of horizontal). I am using django's form.as_table but it is still not rendering correctly. Any ideads?

form.html:

<form id="formset" class="original" action="{% url 'inventory:requests' inventory.id %}" method="post">{% csrf_token %} 
<!-- <a href="#" id="insert-more"> Add New Row </a> -->
    {{formset.management_form}}
        {% for form in formset.forms %}

            {{ form.non_field_errors }}
            {{ form.errors}}
            <div class='item'>

            <table>{{ form.as_table }}</table>
              <p style=""><a class="delete" href="#">Delete</a></p>

            </div>

        {% endfor %}

        <p><a id="add" href="#">Add another item</a></p>

        <input type="submit" name="submit" value="Request Blocks" id="submitButton">

</form>

Upvotes: 0

Views: 1182

Answers (1)

Burhan Khalid
Burhan Khalid

Reputation: 174662

The form's as_table method just uses <tr></td> instead of <div> to render your form - but it will be rendered visually the same way.

To easily get control over your form, consider using django-crispy-forms. Here is is how you would make your form render horizontally:

In your forms.py, add this (in addition to your normal code):

from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit

class ExampleFormSetHelper(FormHelper):
    def __init__(self, *args, **kwargs):
        super(ExampleFormSetHelper, self).__init__(*args, **kwargs)
        self.form_method = 'post'
        self.render_required_fields = True
        self.template = 'bootstrap/table_inline_formset.html'
        self.add_input(Submit("submit", "Save"))

Next, in your views.py:

from .forms import ExampleFormsetHelper, YourFormSet

def formset_view(request):
    formset = YourFormSet()
    helper = ExampleFormSetHelper()
    return render(request, 'template.html',
                 {'formset': formset, 'helper': helper})

Finally, in your template, all you need is:

{% load crispy_forms_tags %}
{% crispy formset helper %}

For more details, the documentation has the specifics.

Upvotes: 1

Related Questions