diff --git a/django/forms/jinja2/django/forms/field.html b/django/forms/jinja2/django/forms/field.html index 21035b72e4..642d45ddc7 100644 --- a/django/forms/jinja2/django/forms/field.html +++ b/django/forms/jinja2/django/forms/field.html @@ -1,5 +1,5 @@ {% if field.use_fieldset %} -
+ {% if field.label %}{{ field.legend_tag() }}{% endif %} {% else %} {% if field.label %}{{ field.label_tag() }}{% endif %} diff --git a/django/forms/templates/django/forms/field.html b/django/forms/templates/django/forms/field.html index f8b0cdedd5..a4548fe54f 100644 --- a/django/forms/templates/django/forms/field.html +++ b/django/forms/templates/django/forms/field.html @@ -1,10 +1,9 @@ {% if field.use_fieldset %} -
+ {% if field.label %}{{ field.legend_tag }}{% endif %} {% else %} {% if field.label %}{{ field.label_tag }}{% endif %} {% endif %} {% if field.help_text %}
{{ field.help_text|safe }}
{% endif %} {{ field.errors }} -{{ field }} -{% if field.use_fieldset %}
{% endif %} +{{ field }}{% if field.use_fieldset %}
{% endif %} diff --git a/docs/ref/forms/fields.txt b/docs/ref/forms/fields.txt index 9dff2d4007..ed685cfff6 100644 --- a/docs/ref/forms/fields.txt +++ b/docs/ref/forms/fields.txt @@ -283,9 +283,10 @@ fields. We've specified ``auto_id=False`` to simplify the output:
Sender:
A valid email address, please.
Cc myself:
-When a field has help text and the widget is not rendered in a ``
``, -``aria-describedby`` is added to the ```` to associate it to the -help text: +When a field has help text it is associated with its input using the +``aria-describedby`` HTML attribute. If the widget is rendered in a +``
`` then ``aria-describedby`` is added to this element, otherwise it +is added to the widget's ````: .. code-block:: pycon @@ -325,6 +326,10 @@ inside ``aria-describedby``: ``aria-describedby`` was added to associate ``help_text`` with its input. +.. versionchanged:: 5.1 + + ``aria-describedby`` support was added for ``
``. + ``error_messages`` ------------------ diff --git a/docs/releases/5.1.txt b/docs/releases/5.1.txt index d6c07d9c22..b90808be3c 100644 --- a/docs/releases/5.1.txt +++ b/docs/releases/5.1.txt @@ -138,7 +138,9 @@ File Uploads Forms ~~~~~ -* ... +* In order to improve accessibility and enable screen readers to associate + fieldsets with their help text, the form fieldset now includes the + ``aria-describedby`` HTML attribute. Generic Views ~~~~~~~~~~~~~ diff --git a/tests/forms_tests/tests/test_forms.py b/tests/forms_tests/tests/test_forms.py index 7ea88f0cc8..19ca978c45 100644 --- a/tests/forms_tests/tests/test_forms.py +++ b/tests/forms_tests/tests/test_forms.py @@ -3114,6 +3114,83 @@ Options: A' + "
" + '' + "
" + '
' + "Radio:" + '
Radio help text
' + '
' + '' + "
" + '' + "
" + '
' + "Datetime:" + '
Enter Date and Time
' + '' + '' + "
", + ) + f = FieldsetForm(auto_id=False) + # aria-describedby is not included. + self.assertIn("
", str(f)) + self.assertIn('
', str(f)) + f = FieldsetForm(auto_id="custom_%s") + # aria-describedby uses custom auto_id. + self.assertIn('fieldset aria-describedby="custom_checkbox_helptext"', str(f)) + self.assertIn('
', str(f)) + + def test_fieldset_custom_aria_describedby(self): + # aria-describedby set on widget results in aria-describedby being + # added to widget and not the
. + class FieldsetForm(Form): + checkbox = MultipleChoiceField( + choices=[("a", "A"), ("b", "B")], + widget=CheckboxSelectMultiple(attrs={"aria-describedby": "custom-id"}), + help_text="Checkbox help text", + ) + + f = FieldsetForm() + self.assertHTMLEqual( + str(f), + "
Checkbox:" + '
Checkbox help text
' + '
' + '' + "
" + '' + "
", + ) + def test_as_widget_custom_aria_describedby(self): class FoodForm(Form): intl_name = CharField(help_text="The food's international name.")