# Prompt Modals

Use a prompt modal to ask users to provide information before they continue. The prompt is displayed in a dialog on top of the page content using an overlay.

To display a prompt in Lightning Experience, import `LightningPrompt` from the `lightning/prompt` module, and call `LightningPrompt.open()` with your desired attributes.

`LightningPrompt` is an alternative to the native `window.prompt()` function, which isn’t supported for cross-origin iframes in Chrome and Safari. Unlike the native prompt function, `LightningPrompt.open()` doesn't halt execution on the page, it returns a Promise. Use `async`/`await` or `.then()` for any code you want to execute after the modal is closed.

![A prompt notification with a striped gray header and a text input box over a darkened org.](https://a.sfdcstatic.com/developer-website/sfdocs/lwc/media/dialog_prompt_example.png "A prompt notification")

This example component creates a button that opens the prompt modal UI that you see in the screenshot.

```html
<!-- c/myApp.html -->
<template>
  <lightning-button 
      onclick={handlePromptClick} 
      label="Open Prompt Modal"> 
  </lightning-button>
</template>
```

Import `LightningPrompt` from `lightning/prompt` in the JavaScript file of the component that opens the prompt modal. Create and dispatch a `LightningPrompt` event with `message`, `theme`, `label`, and `defaultValue` attributes. If the user enters text and clicks **OK** in the prompt, the `.open()` function returns a promise that resolves to the input value. If the user clicks **Cancel**, the function returns a promise that resolves to `null`.

```javascript
import { LightningElement } from "lwc";
import LightningPrompt from "lightning/prompt";

export default class MyApp extends LightningElement {
  handlePromptClick() {
    LightningPrompt.open({
      message: "This is the prompt message.",
      //theme defaults to "default"
      label: "Please Respond!", // this is the header text
      defaultValue: "Optional initial input value",
    }).then((result) => {
      // prompt modal has been closed
    });
  }
}
```

:::tip
The [lwc-recipes](https://github.com/trailheadapps/lwc-recipes) repo has a [miscNotificationModules](https://github.com/trailheadapps/lwc-recipes/tree/main/force-app/main/default/lwc/miscNotificationModules) component that demonstrates prompt modals.
:::

For information about the attributes for `LightningPrompt`, see the \[Component Reference]\(<https://developer.salesforce.com/docs/platform/lightning-component-reference/guide/lightning-prompt?type=Specifications>.

**See Also**

- [Component Reference: `lightning/prompt`](https://developer.salesforce.com/docs/platform/lightning-component-reference/guide/lightning-prompt)