I have a web app that allows multi-tasking. If the user is on a page and has made changes, on navigating to a different page, the previous page is added to a list of tasks, which he can then revisit and continue making changes and saving.
Therefore, in cases where the user has made some changes and does not want them anymore, he would need to utilize the "Discard changes" function to get rid of the changes he has made.
In my case, these are the characteristics of such pages:
- Clicking the
Discard changes
button merely resets the page to its initial state it behaves likeReset
button in forms form older websites. - Clicking the
Discard changes
button does not navigate the user to a different page at all. There is no logical page we can navigate the user to. - Clicking
discard changes
displays a modal to confirm that the user is about to throw away all of his changes. - I am essentially following Luke Wroblewski's guidelines for the actions:
download bmml source – Wireframes created with Balsamiq Mockups
Concerns:
When clicking
discard changes
on a page where which has not been modified, it does nothing. Should I hide theDiscard changes
action and only show it when the page's interaction elements has been modified? If not, we can disable the link, but what are ways to communicate that the link will not work until they have modified the page?The
discard changes
is styled as a link as per Luke Wroblewski's article. Is this going to confuse users who might expect to be navigated to a different page (keeping in mind that a modal is displayed when they click it)?