Findings - form audit
Location | Effort to convert into PL | Existing PL component | Form Layout | Alignment | Label location | Tooltips | Placeholder text | Validation | Location of validation | Advance input fields | Semantic HTML | Links | Action buttons | Submit | Screenshots |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Discussion image upload modal https://courses.stage.edx.org/courses/course-v1:Arbi+A101+2015/discussion/forum/ | Already using it. | Yes, form component | Stacked | Left align |
| None | No | Yes | N/A | No | Yes | No | Yes | Modal is closed.Pageis refreshed with ajax. | https://drive.google.com/drive/folders/0B5texp53raJ2dXRIYWl4M0F5Tkk
|
Support 3 forms inside the modal | Medium | text input, textarea | Stacked | Center | Stacked | None | No | Yes - cannot submit with an empty title or body | Native browser validation via input required attribute | No | Yes | No | Yes - Add/Edit post and Cancel (uses UXPL buttons) | Sends AJAX, form disappears and is replaced with post view | https://drive.google.com/drive/folders/0B5texp53raJ2VkJlcUFqemJkT00?usp=sharing
|
Support modal | Min | button | Stacked | Center in PL page, left aligned in non PL page | None | None | No | No | No | No | Yes | No | Yes |
|
https://drive.google.com/drive/folders/0B5texp53raJ2VkJlcUFqemJkT00?usp=sharing |
Write a review – 3rd party iFrame called course talk. But it is good to capture this non-standard form in Platform.
| N/A? since it is3rdparty? | text input, button | Stacked | Left aligned | Top. Reviewteaxtareais missing a label | None | yes | Yes | Bottom | Yes, stars in ratings | Yes. But without aria-attributes | No | Yes. Looks like a link than a button. Cancel button is far bottom left. |
| https://drive.google.com/drive/folders/0B5texp53raJ2WTBiYnZwT25wSUU?usp=sharing |
Screenshots | Type | Optional/Required labels | Using PL | Form Layout | Form Buttons location | Label location | Tooltips | Placeholder | Validation | Location of validation | Advance input | Semantic HTML | Links | Action buttons | Submit | Submiting | Submitted |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Modal | Stacked | Left | Above | Below | Yes | Yes | Modal is closed.Pageis refreshed with ajax. | What happens while the form is processing? Any transitions, animations, etc? | What happens when is done? what is the success message like? error? incomplete? | ||||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|