Documentation

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 optionTypeDescription
messagestring|Element|NodeDialog message. HTML string or DOM element.
titlestringDialog title.
modalbooleanWhen true, dialog opens with overlay.
cacheablebooleanBy default, when closed, the dialog is terminated from DOM. This action can be cancelled, when cacheable: false is specified.
minWidthnumberMinimal window width.
minHeightnumberMinimal window height.
maxWidthnumberMaximum window width.
onOkFunctionButton handler functionOK.
onCancelFunctionButton handler functionCancel.
onYesFunctionButton handler functionYes.
onNoFunctionButton handler functionNo.
okCaptionstringButton captionOK.
cancelCaptionstringButton captionCancel.
yesCaptionstringButton captionYes.
noCaptionstringButton captionNo.
mediumButtonSizebooleanBe 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).
buttonsMessageBoxButtons | ArraySpecifies 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.
popupOptionsobjectSet of options for BX.PopupWindow.

Example

Methods

MethodDescription
messageBox.showShows dialog on the page.
messageBox.closeCloses dialog on the page.
messageBox.getPopupWindowReturns object BX.PopupWindow.
messageBox.setMessageSets dialog content. HTML string or DOM element.
messageBox.getMessageReturns content dialog.
messageBox.setTitleSets dialog title.
messageBox.getTitleReturns dialog title.
messageBox.getOkButtonReturns OK button (BX.UI.Button class object).
messageBox.getCancelButtonReturns Cancel button (BX.UI.Button class object).
messageBox.getYesButtonReturns Yes button Да (BX.UI.Button class object).
messageBox.getNoButton Returns No button (BX.UI.Button class object).
messageBox.setButtonsSpecifies 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.getButtonsReturns array of dialog buttons.
messageBox.setOkCaptionSets caption for OK button.
messageBox.setCancelCaptionSets caption for Cancel button.
messageBox.setYesCaptionSets caption for Yes button.
messageBox.setNoCaptionSets caption for No button.
messageBox.setOkCallbackSets handler for OK button.
messageBox.setCancelCallbackSets handler for Cancel button.
messageBox.setYesCallbackSets handler for Yes button.
messageBox.setNoCallbackSets handler for No button.
MessageBox.createStatic method for creating a dialog.

options {object} — Set of dialog options (see description of options in new MessageBox).

MessageBox.showCreates and shows dialog on page.

options {object} — selection of dialog options (see description of options in new MessageBox).

MessageBox.alertStatic method for creating advisory dialogs (alert).
MessageBox.confirmStatic 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();
© «Bitrix24», 2001-2022
Up