Thanks to visit codestin.com
Credit goes to github.com

Skip to content

[TwigBridgeRessources] add aria-invalid and aria-describedby on form inputs when validation failure exist #60902

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: 7.4
Choose a base branch
from
Open

[TwigBridgeRessources] add aria-invalid and aria-describedby on form inputs when validation failure exist #60902

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6089a3e
[TwigBridgeRessources] add aria-invalid and aria-describedby on form …
jeanfrancois-morin Jun 23, 2025
0fb1b82
update twig bridge changelog
jeanfrancois-morin Jun 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions src/Symfony/Bridge/Twig/CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
CHANGELOG
=========

7.4
---
* Add `aria-invalid` and `aria-describedby` attributes to form fields when validation errors are present

7.3
---

Expand Down
8 changes: 2 additions & 6 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_3_horizontal_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,7 @@ col-sm-2

{# Rows #}

{% block form_row -%}
{%- set widget_attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- endif -%}
{% block form_row_render -%}
<div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group' ~ ((not compound or force_error|default(false)) and not valid ? ' has-error'))|trim})} %}{{ block('attributes') }}{% endwith %}>
{{- form_label(form) -}}
<div class="{{ block('form_group_class') }}">
Expand All @@ -35,7 +31,7 @@ col-sm-2
{{- form_errors(form) -}}
</div>
{##}</div>
{%- endblock form_row %}
{%- endblock form_row_render -%}

{% block submit_row -%}
<div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group')|trim})} %}{{ block('attributes') }}{% endwith %}>{#--#}
Expand Down
10 changes: 3 additions & 7 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_3_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -127,18 +127,14 @@

{# Rows #}

{% block form_row -%}
{%- set widget_attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- endif -%}
{% block form_row_render -%}
<div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group' ~ ((not compound or force_error|default(false)) and not valid ? ' has-error'))|trim})} %}{{ block('attributes') }}{% endwith %}>
{{- form_label(form) }} {# -#}
{{ form_widget(form, widget_attr) }} {# -#}
{{- form_help(form) -}}
{{ form_errors(form) }} {# -#}
</div> {# -#}
{%- endblock form_row %}
{%- endblock form_row_render -%}

{% block button_row -%}
<div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group')|trim})} %}{{ block('attributes') }}{% endwith %}>
Expand Down Expand Up @@ -187,7 +183,7 @@
{% block form_errors -%}
{% if errors|length > 0 -%}
{% if form is not rootform %}<span class="help-block">{% else %}<div class="alert alert-danger">{% endif %}
<ul class="list-unstyled">
<ul class="list-unstyled" id="{{ id ~ "_errors" }}">
{%- for error in errors -%}
<li><span class="glyphicon glyphicon-exclamation-sign"></span> {{ error.message }}</li>
{%- endfor -%}
Expand Down
8 changes: 6 additions & 2 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_4_horizontal_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,14 @@ col-sm-2
{%- if expanded is defined and expanded -%}
{{ block('fieldset_form_row') }}
{%- else -%}
{%- set widget_attr = {} -%}
{%- set attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- set attr = attr|merge({'aria-describedby': id ~"_help"}) -%}
{%- endif -%}
{%- if errors|length > 0 -%}
{%- set attr = attr|merge({'aria-invalid': 'true'}) -%}
{%- endif -%}
{%- set widget_attr = {attr: attr} -%}
<div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group row' ~ ((not compound or force_error|default(false)) and not valid ? ' is-invalid'))|trim})} %}{{ block('attributes') }}{% endwith %}>
{{- form_label(form) -}}
<div class="{{ block('form_group_class') }}">
Expand Down
8 changes: 6 additions & 2 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_4_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -282,10 +282,14 @@
{%- if compound is defined and compound -%}
{%- set element = 'fieldset' -%}
{%- endif -%}
{%- set widget_attr = {} -%}
{%- set attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- set attr = attr|merge({'aria-describedby': id ~"_help"}) -%}
{%- endif -%}
{%- if errors|length > 0 -%}
{%- set attr = attr|merge({'aria-invalid': 'true'}) -%}
{%- endif -%}
{%- set widget_attr = {attr: attr} -%}
<{{ element|default('div') }}{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' form-group')|trim})} %}{{ block('attributes') }}{% endwith %}>
{{- form_label(form) -}}
{{- form_widget(form, widget_attr) -}}
Expand Down
8 changes: 2 additions & 6 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_5_horizontal_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,14 +23,10 @@

{# Rows #}

{% block form_row -%}
{% block form_row_render -%}
{%- if expanded is defined and expanded -%}
{{ block('fieldset_form_row') }}
{%- else -%}
{%- set widget_attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- endif -%}
{%- set row_class = row_class|default(row_attr.class|default('mb-3')) -%}
{%- set is_form_floating = is_form_floating|default('form-floating' in row_class) -%}
{%- set is_input_group = is_input_group|default('input-group' in row_class) -%}
Expand Down Expand Up @@ -68,7 +64,7 @@
{%- endif -%}
{##}</div>
{%- endif -%}
{%- endblock form_row %}
{%- endblock form_row_render %}

{% block fieldset_form_row -%}
{%- set widget_attr = {} -%}
Expand Down
10 changes: 4 additions & 6 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_5_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -320,14 +320,10 @@

{# Rows #}

{%- block form_row -%}
{%- block form_row_render -%}
{%- if compound is defined and compound -%}
{%- set element = 'fieldset' -%}
{%- endif -%}
{%- set widget_attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- endif -%}
{%- set row_class = row_class|default(row_attr.class|default('mb-3')|trim) -%}
<{{ element|default('div') }}{% with {attr: row_attr|merge({class: row_class})} %}{{ block('attributes') }}{% endwith %}>
{%- if 'form-floating' in row_class -%}
Expand All @@ -340,7 +336,7 @@
{{- form_help(form) -}}
{{- form_errors(form) -}}
</{{ element|default('div') }}>
{%- endblock form_row %}
{%- endblock form_row_render %}

{%- block button_row -%}
<div{% with {attr: row_attr|merge({class: row_attr.class|default('mb-3')|trim})} %}{{ block('attributes') }}{% endwith %}>
Expand All @@ -352,9 +348,11 @@

{%- block form_errors -%}
{%- if errors|length > 0 -%}
<div id="{{ id ~ "_errors" }}">
{%- for error in errors -%}
<div class="{% if form is not rootform %}invalid-feedback{% else %}alert alert-danger{% endif %} d-block">{{ error.message }}</div>
{%- endfor -%}
</div>
{%- endif %}
{%- endblock form_errors %}

Expand Down
23 changes: 19 additions & 4 deletions src/Symfony/Bridge/Twig/Resources/views/Form/form_div_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -366,17 +366,32 @@
{%- endblock repeated_row -%}

{%- block form_row -%}
{%- set widget_attr = {} -%}
{%- set attr = {} -%}
{%- set aria_describedby = [] -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- set aria_describedby = aria_describedby|merge([id ~ "_help"]) -%}
{%- endif -%}
{%- if errors|length > 0 -%}
{%- set aria_describedby = aria_describedby|merge([id ~ "_errors"]) -%}
{%- endif -%}
{%- if aria_describedby|length > 0 -%}
{%- set attr = attr|merge({'aria-describedby': aria_describedby|join(' ')}) -%}
{%- endif -%}
{%- if errors|length > 0 -%}
{%- set attr = attr|merge({'aria-invalid': 'true'}) -%}
{%- endif -%}
{%- set widget_attr = {attr: attr} -%}
{{- block('form_row_render') -}}
{%- endblock form_row -%}

{%- block form_row_render -%}
<div{% with {attr: row_attr} %}{{ block('attributes') }}{% endwith %}>
{{- form_label(form) -}}
{{- form_errors(form) -}}
{{- form_widget(form, widget_attr) -}}
{{- form_help(form) -}}
</div>
{%- endblock form_row -%}
{%- endblock form_row_render -%}

{%- block button_row -%}
<div{% with {attr: row_attr} %}{{ block('attributes') }}{% endwith %}>
Expand Down Expand Up @@ -419,7 +434,7 @@

{%- block form_errors -%}
{%- if errors|length > 0 -%}
<ul>
<ul id="{{ id ~ "_errors" }}">
{%- for error in errors -%}
<li>{{ error.message }}</li>
{%- endfor -%}
Expand Down
8 changes: 2 additions & 6 deletions src/Symfony/Bridge/Twig/Resources/views/Form/form_table_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
{% use "form_div_layout.html.twig" %}

{%- block form_row -%}
{%- set widget_attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- endif -%}
{%- block form_row_render -%}
<tr{% with {attr: row_attr} %}{{ block('attributes') }}{% endwith %}>
<td>
{{- form_label(form) -}}
Expand All @@ -15,7 +11,7 @@
{{- form_help(form) -}}
</td>
</tr>
{%- endblock form_row -%}
{%- endblock form_row_render -%}

{%- block button_row -%}
<tr{% with {attr: row_attr} %}{{ block('attributes') }}{% endwith %}>
Expand Down
10 changes: 3 additions & 7 deletions src/Symfony/Bridge/Twig/Resources/views/Form/foundation_5_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -281,11 +281,7 @@

{# Rows #}

{% block form_row -%}
{%- set widget_attr = {} -%}
{%- if help is not empty -%}
{%- set widget_attr = {attr: {'aria-describedby': id ~"_help"}} -%}
{%- endif -%}
{% block form_row_render -%}
<div{% with {attr: row_attr|merge({class: (row_attr.class|default('') ~ ' row')|trim})} %}{{ block('attributes') }}{% endwith %}>
<div class="large-12 columns{% if (not compound or force_error|default(false)) and not valid %} error{% endif %}">
{{- form_label(form) -}}
Expand All @@ -294,7 +290,7 @@
{{- form_errors(form) -}}
</div>
</div>
{%- endblock form_row %}
{%- endblock form_row_render %}

{% block choice_row -%}
{% set force_error = true %}
Expand Down Expand Up @@ -340,7 +336,7 @@

{% block form_errors -%}
{% if errors|length > 0 -%}
{% if form is not rootform %}<small class="error">{% else %}<div data-alert class="alert-box alert">{% endif %}
{% if form is not rootform %}<small class="error" id="{{ id ~ "_errors" }}">{% else %}<div data-alert class="alert-box alert" id="{{ id ~ "_errors" }}">{% endif %}
{%- for error in errors -%}
{{ error.message }}
{% if not loop.last %}, {% endif %}
Expand Down
2 changes: 1 addition & 1 deletion src/Symfony/Bridge/Twig/Resources/views/Form/tailwind_2_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@

{%- block form_errors -%}
{%- if errors|length > 0 -%}
<ul>
<ul id="{{ id ~ "_errors" }}">
{%- for error in errors -%}
<li class="{{ error_item_class|default('text-red-700') }}">{{ error.message }}</li>
{%- endfor -%}
Expand Down
Loading