Suppose I have a screen with 2 elements: a selection table and a form. I am able to select elements from the 2d table like structure and upon selection the item's properties would appear in the form, the inputs can be edited and upon save the properties are saved.

this works well for single selection, but if one would be able to select multiple the problem I'm not sure the form would cover would be

  • unsetting a field's value to empty string for multiple selection" (you select 2 elements and want them both to have Field1 = "")


  • leaving a field as is for all the elements in the selection but modifying other fields.

In both cases I would be tempted to leave the field empty, as it was presented, but upon save how is one to differentiate between the 2 cases?

Multiple edit

Also would there be an alternative to this? It was thought about showing the multiple selection's properties in a grid/table format, where you can check all the fields for all the entities selected, among other things.

  • What do you show in Field1 in the form if the value in Field1 for all selected elements is different? – Paul van den Dool Mar 16 '17 at 12:12
  • @PaulvandenDool it was proposed to have an exclamation mark near the input or a sort of way of signaling the user that entities have different values for said input. as for the input itself it was proposed to be empty. – Vee6 Mar 16 '17 at 12:41

If I'm understanding your question correctly I might have some ideas.

Empty field
This one is hard. Like you say in the comments, you leave the input blank when the values are not the same. I've seen this pattern before, but I can't remember where. I'm familiar with it and if only I could remember what it was, I might be more confident in saying if this is convention or not.
But fact is, in my opinion, this is a viable solution. But how do you empty an empty input field?
I think the only solution is to add a button/link next to or below the input that says something like empty or remove.

Don't change all inputs
I've done something similar to this. My solution was to detect changes to the input. If an input was touched I removed a classname that was called pristine and added .dirty instead. I only updated values from "dirty" input fields.

I hope this helps.

  • "don't change all inputs": I agree that changing an input and making it dirty could mean marking it for saving, but let's say a user selects multiple items with different for Field1, so the form input field is empty. if he modifies it and then later reverts it back 'empty' how do we know whether 1) he wants to not touch this field on all selected upon saving OR 2) set all the fields values to a null like value for all the items in the selection? it would need to be something that's also incredibly obvious for the user as well (what he is about to do) – Vee6 Mar 16 '17 at 15:46
  • 1
    In my example we worked with a different visual state for "dirty" inputs. What if you, in addition to the empty button/link, also add an reset function? – Paul van den Dool Mar 16 '17 at 16:08
  • That could be done, it would have to be added to all the inputs. The "pristine" input color could be yellow or something like that and the "dirty" input color white, then somehow engage the user with the color code meaning. Thanks, I'll pass those suggestions to the UX team. – Vee6 Mar 16 '17 at 17:32

Fields can indicate the state of selection with text displayed differently so that user can quickly comprehend that values vary among the objects.

Clicking in the field would clear the message - "Multiple Values" in this case - so that user could enter a value that all of the selected objects would then share for that field.

Might use "Different Values" If trying to cover states where some fields are blank as "different" doesn't connote existence/non-existence of data.

All values the same All values the same

Some values the same Some values different

All values different All Values different

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.