This is part of a set of UI requirements related to the collections UI, specifically, in adding collection items.
In the current design, many users tend to enter data into the fields in the visible add line but then don't select the add button, so the data doesn't get added, and can be lost on submitting the page. This relates to the current design where the add row is the first in the collection, with the only difference being the add button instead of the delete button (same placement). These users don't realize or notice that activating the add button is required.
Solution: Add via lightbox. See mocks and diagrams section below.
Note 1: There is another UI requirement in 2.2 milestone 2 that creates another way to solve this same problem, with a new add line/behavior construct. Both of these options should be available to applications.
Note 2: In Rice 2.0, KRAD added the option of moving the add line visually outside of the current collection content and shading it, so that users could more easily perceive its difference from the current collection. That option will continue to be supported in 2.2. Applications will have 3 choices for presenting the Add operation to users.
See the Mocks and Diagrams section below.
See the Mocks and Diagrams section that follows.
Mocks and Diagrams
The Add button is placed above the current content of the collection:
When the user activates the Add button, a modal dialog box (lightbox) opens (the user can still see their place in the task flow, the collection UI, but can't operate with anything else but the lightbox until they cancel or add the item). The keyboard focus is placed in the first field in the new collection item. The add button is greyed out/disabled and the cancel button is the default action until data is entered into a field:
When the user enters data into at least one of the fields, the Add button is no longer disabled and it becomes the default action. The user can still choose to cancel (that button is not disabled):
After the user activates the Add button, KRAD adds the item to the collection and closes the lightbox. Added collection items (rows) are indicated with a light yellow background shading (specific value tbd), until the form is submitted (this treatment is another of the requirements in the set of collections UI requirements, referred to in the Purpose section above):
If applicable, list expectations for performance (optimal and worst cases would be fine, give time in seconds):
Include links to other confluence pages or external resources that might be helpful for this issue:
List all requirements (individual verifiable statements) that indicate whether the work for this item has been complete. If there are requirements that are not essential to the functionality but would be nice to have if time allows, enter those under 'Secondary':
List any functional or technical work that must be completed before work on this item can begin:
List any issues that need to be resolved before work on this item can begin:
QA or Regression Testing Plan
List steps needed to test the basic functionality of this update, enhancement, bug fix
Functional Analysis Complete? No (completed by SME)
Needs Review by KAI? No (completed by SME)
Technical Analysis Complete? No (completed by DM)
Needs Review by KTI? No (completed by DM)
Estimate: 30 hours (completed by DM)
Technical Design: Link Here (completed by DM)
Final Documentation: Link Here (completed by DM)
Added to QA: No (completed by SME)