Opened 14 years ago

Closed 11 years ago

#13401 closed Bug (wontfix)

Forms RadioInput produces invalid HTML

Reported by: pajatso Owned by: nobody
Component: Forms Version: 1.1
Severity: Normal Keywords:
Cc: m@… Triage Stage: Design decision needed
Has patch: no Needs documentation: no
Needs tests: no Patch needs improvement: no
Easy pickings: no UI/UX: no

Description

django.forms RadioInput widget produces invalid HTML. The input tag is rendered inside the label tag which is semantically invalid. It makes it difficult to apply styles to the RadioInput and RadioSelect (multiple radioinputs) widget. The problem can be fixed by modifying the last row from RadioInput widgets unicode method:

original:
return mark_safe(u'<label%s>%s %s</label>' % (label_for, self.tag(), choice_label))

fixed:
return mark_safe(u'<label%s>%s</label>%s' % (label_for, choice_label, self.tag()))

Change History (9)

comment:1 by Matt McClanahan, 14 years ago

Not marking it invalid, but placing an input within a label is valid. It's documented behavior for implicitly associating a label with a form control. http://www.w3.org/TR/html4/interact/forms.html#edef-LABEL

comment:2 by Russell Keith-Magee, 14 years ago

Triage Stage: UnreviewedDesign decision needed

The current syntax is legal HTML (HTML4 and XHTML), so that isn't a reason to change.

The styling issue is an interesting one. I can see how the styling could be easier if we use the explicit form of <label>. However, there is also a significant body of code out there that is styled using the current markup. Just changing the markup isn't really an option, as existing sites will be affected by the change.

There is a larger design issue to address here.

comment:3 by Ramiro Morales, 13 years ago

#14776 reports this again and asks for the same treatment for the CheckboxSelectMultiple widget.

comment:4 by JMagnusson, 13 years ago

Cc: m@… added

Could this be implemented as an option? Something like this:

some_field = forms.ModelChoiceField(queryset=..., widget=forms.RadioSelect(label_position='right'))

Available choices:

  • 'around' (default)
  • 'left'
  • 'right'

comment:6 by Julien Phalip, 13 years ago

Severity: Normal
Type: Bug

See #15667 for a proposal to refactor the whole form templating system.

comment:7 by Aymeric Augustin, 12 years ago

UI/UX: unset

Change UI/UX from NULL to False.

comment:8 by Aymeric Augustin, 12 years ago

Easy pickings: unset

Change Easy pickings from NULL to False.

comment:9 by Aymeric Augustin, 11 years ago

Resolution: wontfix
Status: newclosed

This change is backwards-incompatible. The link in comment 5 provides a workaround.

The long term solution is a template-based form rendering system, which has been considered for a long time but only exists as an external app (floppyforms) at this time.

Note: See TracTickets for help on using tickets.
Back to Top