List Loop - Input field labels are not unique

[obliviga]

Problems

• Some list loop patterns allow users to add multiple generic Add new [name of card e.g. service periods] cards. This can create duplicative headings and fields as it will remain generic until added.
• After adding multiple cards, they can be opened up simultaneously at the same time which creates multiple input fields with the same labels.
• In their non edited states, each card shares the same buttons for editing and deleting
• Navigating by form controls is ineffective with non-descriptive labels

Recommendations

Ideally, the following could solve this problem (albeit as a crude bandaid):

• Only one new card can be added at any given time (solves the first issue)
• Only one card can be edited at any given time (solves the second issue)
• Edit and delete buttons have aria-labels (e.g. Edit Marine Corps) based on the first heading within each card (which depends on the teams it seems like)

Acceptance Criteria

• [ ] Input fields are uniquely labelled

In the following forms:

• [ ] Burials, adding names: /burials-and-memorials/application/530/military-history/previous-names
• [ ] Burials, adding service periods
• [ ] CoE, adding service periods: /housing-assistance/home-loans/request-coe-form-26-1880/service-history
• [ ] CoE, listing all VA-backed loans

[obliviga]

After having a discussion with @joshkimux on this, I think the best course of action right now is to close this ticket, as an actual non-bandaid solution is in the works and is projected to be completed in the upcoming months. This solution is being spearheaded by Robin Garrison and Pamela Hastings. If their solution ends up being a failure, which is very unlikely, then we will open this ticket up again and reassess.