# Confirm Dialog

![Confirm dialog when deleting an address.](https://2555990442-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LXQc7GhOtVRa7Lw1InO%2F-M7nZU76UqpHNvEUBuZ-%2F-M7nk8jQmTyQnmOvZMdP%2Fconfirm-dialog.png?alt=media\&token=854eb611-6cba-4dd7-981d-60cb19e3009c)

### Introduction

The confirm dialog pattern is a specific type of [lightbox dialog](https://ebay.gitbook.io/mindpatterns/disclosure/lightbox-dialog) that gives a user the chance to confirm or cancel an action.

The behaviour is similar to the JavaScript [window.confirm()](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm) method.

### Working Examples

Experience the pattern in action on our companion [eBay MIND Patterns examples website](https://ebay.github.io/mindpatterns/messaging/confirm-dialog).

Examine the required markup structure on our [Bones GitHub project.](https://github.com/ianmcburnie/bones#confirm-dialog)

View a fully styled example on our [eBay Skin website](https://opensource.ebay.com/skin/component/lightbox-dialog).

### Terminology

**Confirm Button**: The button that explicitly confirms the action.

**Reject Button**: The button that explicitly rejects/cancels the action.

**Close Button**: The button that implicitly rejects/cancels the action. Usually an 'X' in the top corner.

**Mask**: The semi-opaque layer that sits between the dialog and the main page.

### Best Practices

Confirm dialogs are always modal and require a mask.

Avoid opening a confirm dialog on page load.

Confirm dialogs should be opened as a result of a user action or critical system event.

Avoid stacking of confirm dialogs.

### Interaction Design

This section provides interaction design for keyboard, screen reader & pointing devices.

#### Keyboard

Keyboard focus should be placed on the *affirmative* button (e.g. "Ok", "Yes", "Agree").

The keyboard should be confined to the interactive elements within the dialog (i.e. modal behaviour).

Pressing `ESC` key **must** close confirm dialog, acting as a cancel/non-affirmative response.

Activating any button will close the dialog and return focus to the main page.

#### Screen Reader

Initial screen reader focus will be placed on the *affirmative* button.

When opened, the screen reader should announce the title of the dialog, its role (dialog) and the label, role and state of the currently focussed element (the *affirmative* button).

The screen reader should be confined to the elements within the dialog (i.e. modal behaviour).

#### Pointer

Clicking the mask **must** close the confirm dialog, acting as a cancel/non-affirmative response.

### Developer Guide

The section is not yet available.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ebay.gitbook.io/mindpatterns/messaging/confirm-dialog.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.