pallets-eco / wtforms

A flexible forms validation and rendering library for Python.
https://wtforms.readthedocs.io
BSD 3-Clause "New" or "Revised" License
1.51k stars 395 forks source link

Remove "for" attribute from RadioField associtated label element #775

Open agascar opened 1 year ago

agascar commented 1 year ago

Actual Behavior

When using a RadioField, the "for" attribute of the associate label, points to the id of a list, whitch is incorrect since list are not form controls, this cause problems with html validators like https://validator.w3.org/


>>> from wtforms import Form, RadioField
>>> class RadioFieldTest(Form):
...     radio_field = RadioField("Options",choices=["Option 1","Option 2"])
...
>>> rt_form = RadioFieldTest()
>>> print(rt_form.radio_field.label())
<label for="radio_field">Options</label>
>>> print(rt_form.radio_field())
<ul id="radio_field"><li><input id="radio_field-0" name="radio_field" type="radio" value="Option 1"> <label for="radio_field-0">Option 1</label></li><li><input id="radio_field-1" name="radio_field" type="radio" value="Option 2"> <label for="radio_field-1">Option 2</label></li></ul>

Expected Behavior

# The expecter behavior is <label >Options</label>, without the "for" attribute

>>> from wtforms import Form, RadioField
>>> class RadioFieldTest(Form):
...     radio_field = RadioField("Options",choices=["Option 1","Option 2"])
...
>>> rt_form = RadioFieldTest()
>>> print(rt_form.radio_field.label())
<label >Options</label>
>>> print(rt_form.radio_field())
<ul id="radio_field"><li><input id="radio_field-0" name="radio_field" type="radio" value="Option 1"> <label for="radio_field-0">Option 1</label></li><li><input id="radio_field-1" name="radio_field" type="radio" value="Option 2"> <label for="radio_field-1">Option 2</label></li></ul>

Environment

MegMM commented 9 months ago

Could this cause an Incorrect use of <label for=FORM_ELEMENT> error?

sort_order = RadioField(u'Sort Order', choices=sort_order_values, 
                            default='descend', validators=[DataRequired()])
    <form-item class="radio-group">
      {{ form.sort_order.label(class="radio-label", id=False) }}
      {% for btn in form.sort_order -%}
      {{ btn(class="radio-btn") }}
      {{ btn.label(class="radio-value") }}
      {%- endfor %} 
    </form-item>