Situation: A store is adding in how much money has been spent on products in their store that week. They can enter the figures either at the individual product level, or at the brand that product belongs to.

So, either at Nestlé level, or at KitKat, Milkybar, Aero...

I want to make sure the user has the flexibility to enter figures at whichever level of hierarchy they want, but also don't want to end up with duplicate or mismatching figures by someone entering in a value at Parent AND at each Child.

This is fine when they first start - we can just disable the Parent / Child field once they choose which level of the hierarchy for that product they're using.

enter image description here

HOWEVER, the issue I'm having is how can we allow the user to change which level they've been using? For various reasons they may need to change from a global Parent (Nestlé) figure to specifying a value for each product instead (or if they've done it at Child level (KitKat) they may want to actually just specify at Parent level instead).

I don't want to fill the fields with toggle icons as that's visually noisy. I don't want to add a global toggle for Parent / Child because there are many brands out there (Coca Cola, Mars etc) and the user may still wish to enter figures at child level for one brand but Parent level for another).

What is a simple method to allow the user to change from one level of hierarchy they've already specified up/down to the other level?

The only thought I currently have is that if the user clicks a Disabled field they will be given a prompt asking if they now wish to add figures at Child level, but that seems like an accessibility fail, and it isn't really that obvious that a disabled field can be clicked.

  • Is it possible to have Parent value and one or several Child ones? E.g. a user enters total value for Nestle is 1000, and for KitKat is 200. The rest Child fields are empty. Does Parent should auto-calculate Child values? Nov 4, 2019 at 11:42
  • No, they'll either have to have one or the other. If Child values need to be specified then it's all the children that will need entering for that parent (well, left blank if it's a zero for any of them).
    – JonW
    Nov 4, 2019 at 11:46

1 Answer 1


I think of something like this:
enter image description here


  • Understandability of the entering mode: either Parent, or Children
  • Eliminate undefined state and possible confuse, when there are some values in the Children nodes, and the user enters Parent value
  • Clear UI due to hiding non-relevant input fields


  • Jumpy behavior of the switch control. The effect should be minimized by animation
  • Not a bad option, to be honest. My reticence was around there being too many toggles all over the page, but you're right; the toggle would only really be needed once per set of child fields. It's not perfect though as it's not totally clear the 'fill items' relates to all the children and not just KitKat, but I think it's a seed of an idea that could work.
    – JonW
    Nov 4, 2019 at 12:26
  • 1
    Yep, the Proximity law says the toggle relates to KitKat only, but here is the place for UI designer to make it more clear for a user ) Nov 4, 2019 at 12:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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