Help and Error Messages

However, If you want to use the input component to create and handle the ui:inputDefaultError component, the error messages will automatically get the ariaDescribedby attribute. If, however, you want to manually manage the action, you will need to make the connection between the ui:inputDefaultError component and the associated output.

If your code failed, check to see if ariaDescribedby is missing. Your component should render like this example:

1<!-- Good: aria-describedby is used to associate error message -->
2<label for="fname">Contact name</label> 
3<input name="" type="text" id="fname" aria-describedby="msgid">
4<ul class="uiInputDefaultError" id="msgid">
5	<li>Please enter the contact name</li>
6</ul>