3

I would like to make a form with this kind of grid :

Grid questions

Do you know how I can do this ? Is there a Django Form widget for that ?

Actually it is questions with the same choices list displayed as radio in a grid.

Thanks,

Natim

Natim
  • 17,274
  • 23
  • 92
  • 150
  • 1
    In that case i would not hesitate to use pure html, and just {% if form.data.email == 'daily' %}checked=checked{% endif %} in radio input tags. KISS all the way. – jpic Jan 04 '12 at 13:49
  • 1
    So you would make an include templatetag with the header (choices) and the fields as parameters ? – Natim Jan 04 '12 at 13:53
  • For the first grid i'd hardcode in the form template that's for sure. For the second grid: an include templatetag sounds like a great idea (why not using django-native-tags). As for arguments, one thing is sure: you need the the choicefields (to build rows) but you can deduce the choices (to build columns) from the fields (field.choices). So it looks like such a signature would work {% my_inc_tag form 'email,newsletter,etc...' %}. Of course the inclusion function will have to prepare the context needed by the included template. It's not straight forward but it's possible. – jpic Jan 04 '12 at 14:06

2 Answers2

4

I'd do this with a django form with one field per line on your grid, with a ChoiceField and RadioSelect as widget:

line1 = forms.ChoiceField(widget=forms.RadioSelect, choices=TRUC)
line2 = …

Then you need to find the template layout to render this correctly. RadioSelect generates a <ul> with eahc choice being a <li>. The choice label is included in the <li>, which is not what you want here.

With floppyforms you could subclass RadioSelect and give it a cutom template_name (look at the floppyforms/radio.html template) to omit the labels. You can also alter it to render, say, table cells (<td>s) instead of <li>, and make your form markup generate a table with the labels in the table's header.

import floppyforms as forms

class RadioSelect(forms.RadioSelect):
    template_name = 'myforms/radio.html'

Put your desired row markup in the above template.

Then, in the template that renders your form:

<form method="post" action="youraction">
  <table>
    <thead>
      <td> <!-- put your form headers here --> </td>
    </thead>
    <tbody>
      {% for field in form %}
        <tr>
          <td>{{ field.label_tag }}</td>
          {{ field }}
        </tr>
      {% endfor %}
    </tbody>
  </table>
<!-- submit button -->
</form>

Then it's only a matter of applying a couple of CSS styles to get the layout you need :)

brutasse
  • 809
  • 5
  • 5
1

You can try this field django-radiogrid

Anton Shurashov
  • 1,820
  • 1
  • 26
  • 39