Merge pull request #2692 from tugcekucukoglu/accessibility-inputtext

Accessibility for InputText
pull/2734/head
Tuğçe Küçükoğlu 2022-06-29 16:09:50 +03:00 committed by GitHub
commit ad7c9902af
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 35 additions and 0 deletions

View File

@ -143,6 +143,41 @@ import InputText from 'primevue/inputtext';
</table> </table>
</div> </div>
<h5>Accessibility</h5>
<DevelopmentSection>
<h6>Screen Reader</h6>
<p>InputText component renders a native input element that implicitly includes any passed prop. Value to describe the component can either be provided via <i>label</i> tag combined with <i>id</i> prop or using <i>aria-labelledby</i>, <i>aria-label</i> props.</p>
<pre v-code><code>
&lt;label for="firstname"&gt;Firstname&lt;/label&gt;
&lt;InputText id="firstname" /&gt;
&lt;span id="lastname"&gt;Lastname&lt;/span&gt;
&lt;InputText aria-labelledby="lastname" /&gt;
&lt;InputText aria-label="Age"/&gt;
</code></pre>
<h6>Keyboard Support</h6>
<div class="doc-tablewrapper">
<table class="doc-table">
<thead>
<tr>
<th>Key</th>
<th>Function</th>
</tr>
</thead>
<tbody>
<tr>
<td><i>tab</i></td>
<td>Moves focus to the input.</td>
</tr>
</tbody>
</table>
</div>
</DevelopmentSection>
<h5>Dependencies</h5> <h5>Dependencies</h5>
<p>None.</p> <p>None.</p>
</AppDoc> </AppDoc>