Search code examples
user-experience

Forms: Creating one item before another

What should be the best UX for a situation where one set of record cannot exist without another.

Take a scenario in an application where a child can be connected to zero or more parents.

If a user of our application finds himself filling a form to create a child but the parent for the child does not exist yet, what is the best approach to creating the parent and then attaching that parent to the child.

  1. Should the child be created without the parent, but updates can be done to add parent to child, note that this also has its own issues as the page where the addition will occur might also need to create the parent.
  2. Have a link on the child page that says "create parent", and route back the user back to the child page after creating the parent.
  3. Have a button bring up a modal that has the parent form and allow the user to create the parent before returning.

I don't like any one of these three options and I am hoping there are better approach out there.

Sorry for any typos or ambiguity, in bit of a rush, also not sure if this is the right place to ask the question.

Solution

  • Since the records are depending on each other I would make sure the user submits these together but make it look like 2 different elements on the same page.

    You could use a tab-menu to switch between the child and parent but both should be filled in before submitting. Some inspiration even though you don't need to fill in multiple tabs here. Just make sure it's easy for the user to see that he needs to fill in both tabs.

    Another option could be to have the child form collapse when finished/closed like a drop-down menu with an expand arrow button incase you want to edit it again. And the same with a parent box below it. Something that looks a little like this. They could both be closed at the loading of the page so the user sees both boxes.