API Docs

Create Dialog

Create Dialog - kintone.createDialog()

Creates and displays a message dialog box on the page.

Function

Desktop

kintone.createDialog(config)

Mobile

For mobile, use the following API:

Parameters

Parameter Type Required Description
config Object Required The dialog configuration.
config.title String Optional The title.
If ignored, it will not be displayed.
config.body Element object Optional The dialog body element.
If ignored, it will not be displayed.
config.showOkButton Boolean Optional The visibility of the OK button.
  • true: Display
  • false: Do not display
If ignored, it will be displayed.
config.okButtonText String Optional The text to display on the OK button.
If ignored, "OK" will be displayed according to the logged-in user's language.
config.showCancelButton Boolean Optional The visibility of the Cancel button.
  • true: Display
  • false: Do not display
If ignored, it will not be displayed.
config.cancelButtonText String Optional Text to display on the Cancel button.
If ignored, "Cancel" will be displayed according to the logged-in user's language.
config.showCloseButton Boolean Optional The visibility of the Close button.
  • true: Display
  • false: Do not display
If ignored, it will not be displayed.
If not displayed, the function to close the dialog with the Esc key is also disabled.
config.beforeClose Function Optional A function to run before closing the dialog by any of the following operations: OK button/Cancel button/Close button/Esc key.
The user's selected operation is passed as an argument to the function.
  • OK: The OK button is clicked
  • CANCEL: The Cancel button is clicked
  • CLOSE: The Close button is clicked or the Esc key is pressed
If the function returns false or a value that becomes false after the Promise is resolved, the dialog will not close

Returns

A Promise object.
The following values can be retrieved when the Promise object is fulfilled:

Property Type Description
show Function An asynchronous function that displays the created dialog.
It has no arguments.
The return value is a Promise object.
When the dialog is closed, the Promise object is resolved and the following values can be retrieved:
  • OK: When the user clicks the OK button
  • CANCEL: When the user clicks the Cancel button
  • CLOSE: When the user clicks the Close button or presses the Esc key
  • FUNCTION: When the close function is called
close Function A function that closes the dialog.
It has no argument or return value.

Available Pages (Desktop)

However, it cannot be used on the following pages:

  • Search results
  • Marketplace

Sample Request

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22

const bodyElement = document.createElement('p');
bodyElement.textContent = 'Do you want to delete this record?';

// Create a dialog
const dialog = await kintone.createDialog({
  title: 'Confirmation',
  body: bodyElement,
  okButtonText: 'Delete',
  showCancelButton: true,
  cancelButtonText: 'Cancel',
  showCloseButton: true,
  beforeClose: (action) => {
    if (action === 'OK') {
      console.log('Record deleted');
    } else {
      console.log('Delete canceled');
    }
  }
});

// Show the dialog
await dialog.show();

Notes

The Element object specified in the config.body argument is used directly as the dialog body element.
Perform sanitization processing as necessary.