Django Forms Manual Formatting

Question

I'm having issues with formatting a Django Formset and I don't know what the best approach is...was hoping to get your experienced feedback.

I have a formset (SystemConfigurationFormset) which has a form (SystemConfiguration) with the following two fields:

1. memory_size - IntegerField
2. cpu_cores - IntegerField

I've read up quite a bit on Formsets and I'm still a little confused if I've got the right approach down. Essentially, I want to repeat the same form 3 times on the same web page. Clicking Submit should submit all the data from the three forms uniquely (using some prefix to identify each form of the formset).

The thing is, I need to have a separate heading for each form. Ex:

Form1-Name Form2-Name

-form-1-here- -form-2-here-

(Forms next to each other)

How would I go about this approach? Right now, this is my nasty code, which I'm sure you can tell is not correct:

        <div class="box-content">
        <div class="row-fluid"> 
            <form class="form-horizontal" action="" method="POST"> {% csrf_token %}
                <div class="span3" onTablet="span6" onDesktop="span3">
                    {{ formset.management_form }}
                    <h2><b>Application VM</b></h2>
                    <fieldset>
                        {{ formset.form.as_table }}
                    </fieldset>
                </div>
                <div class="span3" onTablet="span6" onDesktop="span3">
                    <h2><b>Router VM</b></h2>
                    <fieldset>
                        {{ formset.form.as_table }}
                    </fieldset>
                </div>
                <div class="span3" onTablet="span6" onDesktop="span3">
                    <h2><b>System VM</b></h2>
                    <fieldset>
                        {{ formset.form.as_table }}
                    </fieldset>
                </div>
        </div>
        <div class="form-actions">
            <!-- <button type="submit" class="btn btn-primary">Save changes</button> -->
            <button type="submit" class="btn btn-primary">Save</button>
            <button type="reset" class="btn">Reset</button>
        </div>
        </form>

Your help is greatly appreciated!

Answer 1

Here is one solution with a bit of hacking for the titles of the forms. if you would like to get rid of that I would recommend using python's zip function in your view to combine the formset and a list of the titles. an example of doing that cand be found in this answer .

{{ formset.management_form }}
{% for form in formset %}
  <div class="span3" onTablet="span6" onDesktop="span3">
    <h2><b>
      {% if forloop.counter == 1 %}
        Application VM
      {% elif forloop.counter == 2 %}
        Router VM
      {% elif forloop.counter == 3 %}
        System VM
      {% endif %}
    </b></h2>
    <fieldset>
      {{ form.as_table }}
    </fieldset>
  </div>
{% endfor %}