id	summary	reporter	owner	description	type	status	component	version	severity	resolution	keywords	cc	stage	has_patch	needs_docs	needs_tests	needs_better_patch	easy	ui_ux
20931	RadioSelect, RadioSelectMultiple, CheckBoxSelect, CheckBoxSelectMultiple do not render nested option sets correctly	Dylan Verheul	Christopher Babiak	"The `Select` widget is the default widget to handle fields that make use of `choices`. These are commonly rendered as a HTML `select`, as implemented for `django.forms.widgets.Select`.

Sometimes a series of radio buttons or checkboxes is a better fir for the UI. Django supports this by implementing widgets that can stand in for `Select`. These are `RadioSelect`, `RadioSelectMultiple`, `CheckBoxSelect`, `CheckBoxSelectMultiple`.

The choices to render are implemented as a n iterable of 2-tuples as documented here:
https://docs.djangoproject.com/en/dev/ref/models/fields/#field-choices

As stated in the documentation, `choices` can be grouped for organizational purposes. The example given:

{{{
MEDIA_CHOICES = (
    ('Audio', (
            ('vinyl', 'Vinyl'),
            ('cd', 'CD'),
        )
    ),
    ('Video', (
            ('vhs', 'VHS Tape'),
            ('dvd', 'DVD'),
        )
    ),
    ('unknown', 'Unknown'),
)
}}}

When using a `Select` or `SelectMultiple` widget, these groups are rendered as HTML `optgroup` elements. This is correct.

When using any of the other widgets mentioned, the organizational groups are not taken into account when rendering the widget. Instead, the entire group is forced to text without escaping, resulting in a single widget for each group, with the text representation of the list as its label (newlines and spaces added for better readability):

{{{
<label for=""id_category3_0"">
    <input id=""id_category3_0"" name=""category3"" placeholder=""Category3"" title="""" type=""radio"" value=""Audio"" />
    ((&#39;vinyl&#39;, &#39;Vinyl&#39;), (&#39;cd&#39;, &#39;CD&#39;))
</label>
}}}

The solution for this would be take have the renders of these widgets mimic the behavior of `Select.render_options`, but instead of `optgroup` an extra level of `ul` would have to be generated. In pseudo-HTML, for the given example:

{{{
<ul>
    <li>
        Audio
            <ul>
                <li>(input element for vinyl</li>
                <li>(input element for CD</li>
            </ul>
    </li>
    ....
</ul>
}}}"	Bug	closed	Forms	dev	Normal	fixed	choices	Carl Meyer	Accepted	0	0	0	0	0	0