MessageBox Class

The class creates standard advisory and informational dialogs (alert and confirm).

new BX.UI.Dialogs.MessageBox(
{
    options;
}
);

Class object options

options {object} — set of dialog options. List of dialog options in the table:

Dialog option Type Description

message string|Element|Node Dialog message. HTML string or DOM element.

title string Dialog title.

modal boolean When true, dialog opens with overlay.

cacheable boolean By default, when closed, the dialog is terminated from DOM. This action can be cancelled, when cacheable: false is specified.

minWidth number Minimal window width.

minHeight number Minimal window height.

maxWidth number Maximum window width.

onOk Function Button handler functionOK.

onCancel Function Button handler functionCancel.

onYes Function Button handler functionYes.

onNo Function Button handler functionNo.

okCaption string Button captionOK.

cancelCaption string Button captionCancel.

yesCaption string Button captionYes.

noCaption string Button captionNo.

mediumButtonSize boolean Be default, dialog buttons have small size. If the parameter mediumButtonSize is set as true, button size will be standard (medium). If the parameter title is set, the property mediumButtonSize is automatically set as true (this behavior can be cancelled via mediumButtonSize: false).

buttons

MessageBoxButtons | Array

Specifies set of dialog buttons. The structure MessageBoxButtons defines the following standard sets:

MessageBoxButtons.OK — button OK.
MessageBoxButtons.CANCEL — button Cancel.
MessageBoxButtons.YES — button Yes.
MessageBoxButtons.NO — button No.
MessageBoxButtons.OK_CANCEL — buttons OK and Cancel.
MessageBoxButtons.YES_NO — Buttons Yes and No.
MessageBoxButtons.YES_CANCEL — buttons Yes and Cancel.
MessageBoxButtons.YES_NO_CANCEL — buttons Yes, No and Cancel.

To set a custom set, specify an array buttons BX.UI.Button.

popupOptions

object

Set of options for BX.PopupWindow.

Example

Methods

Method	Description
messageBox.show	Shows dialog on the page.
messageBox.close	Closes dialog on the page.
messageBox.getPopupWindow	Returns object BX.PopupWindow.
messageBox.setMessage	Sets dialog content. HTML string or DOM element.
messageBox.getMessage	Returns content dialog.
messageBox.setTitle	Sets dialog title.
messageBox.getTitle	Returns dialog title.
messageBox.getOkButton	Returns OK button (BX.UI.Button class object).
messageBox.getCancelButton	Returns Cancel button (BX.UI.Button class object).
messageBox.getYesButton	Returns Yes button Да (BX.UI.Button class object).
messageBox.getNoButton	Returns No button (BX.UI.Button class object).
messageBox.setButtons	Specifies set of dialog buttons. Set is specified by the MessageBoxButtons structure or by a BX.UI.Button object array. `MessageBoxButtons.OK` — OK button. `MessageBoxButtons.CANCEL` — Cancel button. `MessageBoxButtons.YES` — Yes button. `MessageBoxButtons.NO` — No button. `MessageBoxButtons.OK_CANCEL` — buttons OK and Cancel. `MessageBoxButtons.YES_NO` — buttons Yes and No. `MessageBoxButtons.YES_CANCEL` — buttons Yes and Cancel. `MessageBoxButtons.YES_NO_CANCEL` — buttons Yes, No and Cancel.
messageBox.getButtons	Returns array of dialog buttons.
messageBox.setOkCaption	Sets caption for OK button.
messageBox.setCancelCaption	Sets caption for Cancel button.
messageBox.setYesCaption	Sets caption for Yes button.
messageBox.setNoCaption	Sets caption for No button.
messageBox.setOkCallback	Sets handler for OK button.
messageBox.setCancelCallback	Sets handler for Cancel button.
messageBox.setYesCallback	Sets handler for Yes button.
messageBox.setNoCallback	Sets handler for No button.
MessageBox.create	Static method for creating a dialog. options {object} — Set of dialog options (see description of options in new MessageBox).
MessageBox.show	Creates and shows dialog on page. options {object} — selection of dialog options (see description of options in new MessageBox).
MessageBox.alert	Static method for creating advisory dialogs (alert).
MessageBox.confirm	Static method for creating confirmation dialogs (confirm).

Examples

Creating a class object

const messageBox = new BX.UI.Dialogs.MessageBox(
{
    message: "Are you sure you want to delete the file?",
    title: "Confirm deletion",
    buttons: BX.UI.Dialogs.MessageBoxButtons.OK_CANCEL,
    okCaption: "Yes",
    onOk: function() 
    {
        console.log("onOk");
    },
}
);


messageBox.show();

Arbitrary names and button callbacks

const messageBox = new BX.UI.Dialogs.MessageBox(
{
    message: "Various button captions",
    title: "Confirm deletion",
    buttons: BX.UI.Dialogs.MessageBoxButtons.YES_NO_CANCEL,
    yesCaption: "Yes",
    noCaption: "No",
    cancelCaption: "Cancel",
    maxWidth: 600,
    onYes: function() 
    {
        console.log("onYes");
        messageBox.close();
    },
    onNo: function() 
    {
        console.log("onNo");
        messageBox.close();
    },
    onCancel: function(messageBox) 
    {
        console.log("onCancel");
        messageBox.close();
    },
}
);

messageBox.show();