[#524] Add aria-labelledby only when there is a suffix

open-formulieren · Oct 31, 2023 · af510ed · af510ed
1 parent 5bae7cc
commit af510ed
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/formio/templates/label.ejs b/src/formio/templates/label.ejs
@@ -2,7 +2,9 @@
   <label
     class="utrecht-form-label {{ctx.label.className}} {% if (ctx.component.validate.required && ctx.requiredFieldsWithAsterisk) { %}utrecht-form-label--openforms-required{% } %}"
     for="{{ctx.instance.id}}-{{ctx.component.key}}"
-    id="label-{{ctx.instance.id}}-{{ctx.component.key}}"
+    {% if (ctx.component.suffix) { %}
+      id="label-{{ctx.instance.id}}-{{ctx.component.key}}"
+    {% } %}
   >
     {{ ctx.t(ctx.component.label, { _userInput: true }) }}
     {% if (!ctx.component.validate.required && !ctx.requiredFieldsWithAsterisk) { %}

diff --git a/src/formio/templates/text.ejs b/src/formio/templates/text.ejs
@@ -16,7 +16,9 @@
   {{attr}}="{{ctx.input.attr[attr]}}"
   {% } %}
   id="{{ctx.instance.id}}-{{ctx.component.key}}"
-  aria-labelledby="label-{{ctx.instance.id}}-{{ctx.component.key}} {{ctx.instance.id}}-{{ctx.component.key}} suffix-{{ctx.instance.id}}-{{ctx.component.key}}"
+  {% if (ctx.suffix) { %}
+    aria-labelledby="label-{{ctx.instance.id}}-{{ctx.component.key}} {{ctx.instance.id}}-{{ctx.component.key}} suffix-{{ctx.instance.id}}-{{ctx.component.key}}"
+  {% } %}
 >{{ctx.input.content}}</{{ctx.input.type}}>
 {% if (ctx.component.showCharCount) { %}
 <span class="charcount" ref="charcount"></span>