0

I have an edit page with a bunch of select menus, text inputs, and radio buttons, and a save button. Upon clicking the save button, a detail page is displayed with text of the given select menus, inputs, selected radio value. The detail page also has a (you guessed it) an edit button which goes to the edit page.

I wish to make it easier for the user to change various fields directly from the detail page without having to go to the edit page.

I've currently implemented such functionality for the select menus. Upon clicking a given field which relates to a select menu, the field text is replaced with a select menu. Upon selecting an option, the select menu is replaced with the new text. Upon clicking off the element, the menu disappears and the original text reappears. Seems okay, but not certain whether others will feel it is intuitive or it will be too easy to inadvertently change a setting to the wrong value. Maybe some explicit "save change" or "cancel" action is desired?

Question...

What is the most intuitive way to allow users to change select menu, input, and radio button values from a detail page which only displays their current values?

1 Answer 1

1

This is a common edit pattern used by various libraries like X-editable. Its quite intuitive to click on an element, and get a simple pop-up that lets you edit that field:

enter image description here

This UI pattern provides the option to get the user's confirmation, and gives a quick highlight as you confirm the change (the newly changed value gets highlighted with a yellow background).

With selects, you can ask for a confirmation within the small pop up:

enter image description here

2
  • Thanks Adnan, Guess I should have asked this question before creating my own plugin! I agree this UX is more intuitive and will check it out. Mar 31, 2015 at 3:14
  • A side note: X-editable seems to be an abandoned project.
    – tuomassalo
    Sep 16, 2015 at 7:08

Your Answer

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

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