review accessibility about ng-dynamic-forms

[bbarry]

A few things I notice (not particularly focusing on testing this and haven't really studied the code to understand how the various UI versions are related; these are just the things that annoy me when using a typical form) from the demo site:

• clicking on select label should focus select dropdown
• clicking on input label should focus on input
• clicking on checkbox group should focus first checkbox in group (or perhaps cycle: check/uncheck/reset to original state for whole group?)
• clicking on individual checkbox label should check/uncheck box
• clicking on radio group label should focus current active radio option
• clicking on text area label should focus text area
• clicking on array model group input label should focus first/last/first empty (not sure which)? input
• clicking on add item in group input should focus newly added input
• in an group input input, pressing tab to new item button/link then pressing space should focus newly added input

demo should show validation states visually somehow also

On the bright side, tab works pretty good to move around.

[udos86]

@bbarry Thanks for your contribution.

clicking on select label should focus select dropdown
clicking on input label should focus on input
clicking on checkbox group should focus first checkbox in group (or perhaps cycle: check/uncheck/reset to original state for whole group?)
clicking on individual checkbox label should check/uncheck box
clicking on radio group label should focus current active radio option
clicking on text area label should focus text area
clicking on array model group input label should focus first/last/first empty (not sure which)? input
clicking on add item in group input should focus newly added input

The flaw of not selecting a form control when clicking on it's label arises from the fact that no id attributes are bound to the html elements at the moment. This is necessary in order to not create semantically wrong markup when using form arrays. Otherwise there potentially would exist multiple form controls with the same id value. I haven't got a better solution to this so far.

demo should show validation states visually somehow also

The importance of showing validation messages and how this should be done is explained in detail in README.md. However it is not a building block of the actual library. But you're right. I should take the time to improve the example nevertheless.

[bbarry]

Reviewing the markup for the individual checkboxes, I believe removing the for attribute would be sufficient (a label surrounding a single input is historically adequate for semantically associating them).
w3.org agrees: https://www.w3.org/WAI/tutorials/forms/labels/#associating-labels-implicitly

[udos86]

@bbarry Alright, thanks! Will be corrected in next version!

[udos86]

@bbarry There'll be a solution for focusing the controls when clicking the labels, as well!