1
0
mirror of https://github.com/django/django.git synced 2025-10-24 06:06:09 +00:00

Fixed #32820 -- Added aria-invalid="true" to fields with errors.

Co-authored-by: Demetris Stavrou <demestav@gmail.com>
Co-authored-by: David Smith <smithdc@gmail.com>
This commit is contained in:
Gregor Jerše
2023-06-02 16:27:24 +02:00
committed by Mariusz Felisiak
parent fff14736f1
commit 10725a3187
7 changed files with 156 additions and 95 deletions

View File

@@ -992,10 +992,20 @@ method you're using:
... }
>>> f = ContactForm(data, auto_id=False)
>>> print(f)
<div>Subject:<ul class="errorlist"><li>This field is required.</li></ul><input type="text" name="subject" maxlength="100" required></div>
<div>Message:<textarea name="message" cols="40" rows="10" required>Hi there</textarea></div>
<div>Sender:<ul class="errorlist"><li>Enter a valid email address.</li></ul><input type="email" name="sender" value="invalid email address" required></div>
<div>Cc myself:<input type="checkbox" name="cc_myself" checked></div>
<div>Subject:
<ul class="errorlist"><li>This field is required.</li></ul>
<input type="text" name="subject" maxlength="100" required aria-invalid="true">
</div>
<div>Message:
<textarea name="message" cols="40" rows="10" required>Hi there</textarea>
</div>
<div>Sender:
<ul class="errorlist"><li>Enter a valid email address.</li></ul>
<input type="email" name="sender" value="invalid email address" required aria-invalid="true">
</div>
<div>Cc myself:
<input type="checkbox" name="cc_myself" checked>
</div>
.. _ref-forms-error-list-format:
@@ -1154,7 +1164,7 @@ Attributes of ``BoundField``
>>> data = {"subject": "hi", "message": "", "sender": "", "cc_myself": ""}
>>> f = ContactForm(data, auto_id=False)
>>> print(f["message"])
<input type="text" name="message" required>
<input type="text" name="message" required aria-invalid="true">
>>> f["message"].errors
['This field is required.']
>>> print(f["message"].errors)
@@ -1166,6 +1176,13 @@ Attributes of ``BoundField``
>>> str(f["subject"].errors)
''
When rendering a field with errors, ``aria-invalid="true"`` will be set on
the field's widget to indicate there is an error to screen reader users.
.. versionchanged:: 5.0
The ``aria-invalid="true"`` was added when a field has errors.
.. attribute:: BoundField.field
The form :class:`~django.forms.Field` instance from the form class that

View File

@@ -196,9 +196,17 @@ and the HTML output will include any validation errors:
>>> default_data = {"name": "Your name", "url": "http://"}
>>> f = CommentForm(default_data, auto_id=False)
>>> print(f)
<div>Name:<input type="text" name="name" value="Your name" required></div>
<div>Url:<ul class="errorlist"><li>Enter a valid URL.</li></ul><input type="url" name="url" value="http://" required></div>
<div>Comment:<ul class="errorlist"><li>This field is required.</li></ul><input type="text" name="comment" required></div>
<div>Name:
<input type="text" name="name" value="Your name" required>
</div>
<div>Url:
<ul class="errorlist"><li>Enter a valid URL.</li></ul>
<input type="url" name="url" value="http://" required aria-invalid="true">
</div>
<div>Comment:
<ul class="errorlist"><li>This field is required.</li></ul>
<input type="text" name="comment" required aria-invalid="true">
</div>
This is why ``initial`` values are only displayed for unbound forms. For bound
forms, the HTML output will use the bound data.