Same form fields - two purposes/functions

Question

Working on a project for adding new entry/entries to a table and/or viewing the table.

We have required fields for adding a new entry. Only one of those fields is required for viewing. The expectation is that when the user selects items from the dropdown fields, a table will display with those filters. The user can then click an "Add" button to add a new entry to the displayed table as long as they filled out all the required fields.

See below:

This image is actually an interpretation because I added on the "View" button. Initially, it only had the "Add" button. I suppose they want the table to start displaying and filtering results as the user makes their selection.

I don't think it's good UX, or even good practice in general to make these form fields do double-duty. (Is it even technologically feasible to allow the fields to act both as filters on a table, and data for an entry?)

My solution is to separate the View/Edit from the Add as two separate features. They want them on the same page, which would cause us to have to include these form fields twice in the same page, but for different purposes. Other applications I've worked on have separated these functions entirely into separate tabs or pages, but I can see why in our scenario a user might want/need to see a table while or before adding a new entry.

Thoughts?

Answer 1

One column is mandatory and the rest are optional. First of all I would design it in a way so that the user adds one column at a time. Perhaps a plus button next to the original table with the option to "add new column". The user can then rearrange it later.

Also, another problem with your design is that it breaks the law of locality. The "name" field applies to what? The first, second or third column?

Finally, make the preview button available after you are done adding the new column for better context.

And of course, test!

Answer 2

The only reason that jumps in to my mind why one would do something like this, is to allow a user to add an entry if it does not already exist. So a user is not able to produce duplicate (identical) entries.

I know this pattern from other fields. It is the same principal like in a support form where you can ask a question but before you submit it a list of possible solutions is displayed and only if you cant finde the solution you can submit the question.

With this in mind: If the table above refreshes after each input no "view" button is needed. But the add button should only be shown if no results are found. The add button could be placed along with a "not rows found" message.

But: if the scenario is a different one, i would reconsider a different approach where you separate filter from input. And as others said: I too think that it is really necessary to test with real users.