Integrate lookup and edit functionality

Question

I've looked at a few of the other similar questions, but I don't think they are the same kind of problem.

I am trying to design to link a person to an item. The page supports free text entry for the common person fields (name, phone, etc.). However, the user may want to link an existing person, so I provided a simply search tool. Once the user has identified the existing person, the person info fills out in the fields.

Now if the user realizes they want a different person and begins editing the fields, it would effectively create an edit against the existing person. How can I provide the user with a better experience?

I've thought about disabling the inputs on an existing record and requiring the user to clear the existing record or take explicit action to edit the record. ie. providing a button to clear the current person or edit the current person. Clearing would re-enable the inputs. Editing might take the user to another page. I feel like taking the user to another page or adding a modal for this is more confusing than anything. Is that my best option?

I've added pictures to explain my approach. The update/cancel buttons are only present when editing an existing customer. They are in addition to the form submit button at the bottom of the page. Validation will prevent a submit while edits are still open.

Answer 1

You might want to look at how Google's Material design solves this with its concept of chips.

So in your case once the user links to a person, it is displayed on the screen as a chip. The user can could then remove the chip (unlink) or add a new chip (link a different person).

Here's a link to the design guide on chips: Google Material Design Chip Component

I think that may be a better way to approach the problem. From the examples in the design guide you could think of embedding your form instead of just a simple search to find a person.

Answer 2

Let me see if I understand you (because I think you're overthinking the problem).

As a user I want to associate a person with an item. I look up a person (Josh); think I have the correct information and then realize that I have the wrong Josh and start to edit the information. (Or maybe I have Josh's updated phone number and the system is out of date so I edit the phone number.) Or any of an infinite number of possibilities.

So, what do I do. I see a checkbox (or toggle switch) which clears inputted data. There is no need to take me to a new screen. I can stay on this screen and tab through the fields and edit as needed.

If that's the scenario - then I, the user, am facing a common problem - changing form information.

Anytime the user wants to search and replace the existing name (example: "No. I made a mistake. It's not Josh C who I want to put here. It's John C.)

Then, in that case, the new search results will replace the old information on the same screen.

If you're really concerned you can include a history in which users can see previous entries (although, off hand, I really can't see the value in that).