I am working on a web application where I need to display an alert.

In this alert, clicking on "No" will hide the alert and clicking on "Yes" will remove the selected element (in example).

I would like to add a checkbox like "Remove all sibling elements" of that particular selected element.

Is it recommended UX to combine confirm choices and possible action through a checkbox?

I have read this part of Material Design Guidelines, nothing about checkboxes.

  • Will this alert come inside the dialog? – Sheraz Apr 25 '18 at 13:34
  • Yes sorry for being confusing, in my mind, alert & dialog are similar – Zooly Apr 25 '18 at 13:34
  • Its okay, I've edited your question. – Sheraz Apr 25 '18 at 13:44

I would suggest the following solution:


download bmml source – Wireframes created with Balsamiq Mockups

This way the user needs to make an immediate and explicit decision and there is no issue of forgetting to check or accidentally checking the checkbox.

For smaller/portrait displays the dialog can present like this:


download bmml source

Remember, that on handheld devices the buttons are approached by the touch interface (from the bottom of the screen to the top), hence the most frequent button should be the lowest.

  • Indeed this can be a nice solution :) Just before I approve your answer, may you suggest an alternative for smaller screen? I mean responsive display of this – Zooly Apr 25 '18 at 14:36
  • I've enriched the post with the answer to your request. – Mike Apr 25 '18 at 14:46
  • I'm glad to help when I have a moment to spare. – Mike Apr 25 '18 at 14:47

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.