How do I iterate over the options of a SelectField in a template?

Question

I have a select field in the form and now I need to iterate over options in this field.

{{ form.myselect }} gives me this:

<select name="myselect" id="id_myselect">     <option value="" selected="selected">---------</option>     <option value="2">Item 1</option>     <option value="3">Item 2</option>     ... </select> 

Now I need to add some attributes to the options and because of that what I need is:

<select name="myselect" id="id_myselect"> {% for x in form.myselect %}     <option value="{{ x.id }}">{{ x.name }}</option> {% endfor %} </select> 

but there is an error:

Caught TypeError while rendering: 'BoundField' object is not iterable 

I tried form.myselect.all, form.myselect.option_set but it gives nothing

Answer 1

I've been struggling with this problem today and found the solution. Yes, you can iterate over options of the select tag directly in template. Here's how to do it in template:

<select id="id_customer" name="customer"> {% for x, y in form.fields.customer.choices %}     <option value="{{ x }}"{% if form.fields.customer.value == x %} selected{% endif %}>{{ y }}</option> {% endfor %} </select> 

In this case I have a customer field in the form which has choices set up as follows:

class SomeForm(forms.Form):     customer = forms.ChoiceField(label=u'Customer')      def __init__(self, *args, **kwargs):         super(SomeForm, self).__init__(*args, **kwargs)         self.fields['customer'].choices = [(e.id, e.customer) for e in Customers.objects.all()] 

Hope this helps

Answer 2

Got it to work with:

    <select name="myselect" class="i-can-add-my-own-attrs-now" id="id_myselect">         {% for id, name in form.myselect.field.choices %}         <option value="{{ id }}">{{ name }}</option>         {% endfor %}     </select> 

BUT REALLY, a better way to do this is with django-widget-tweaks:

    {% load widget_tweaks %}     {{ form.myselect|add_class:"i-can-haz-custom-classes-easily" }} 

Doing it with django-widget-tweaks will also set the default 'selected="selected"' for you, which is super nice!