About of AntMessageBox
AntMessageBox, is a pre-defined jQuery ui dialog encapsulated in JavaScript object. Dialog boxes from AntMessageBox are able to contain html (v4 or v5) and optionnal callback binded functions on click event of buttons.
3 available types of dialog box of AntMessageBox :
- MsgDialogBox: basic info dialog box
- AlertDialogBox: alert dialog box like alert function of javascript. Callback functions could be specified on click event "ok" button.
- ConfirmDialogBox: confirm dialog box like confirm function of javascript. Callback functions could be specified on click event of "ok/cancel" buttons.
Type is defined on display of MessageBox. Some settings of each types are available to customise them. Demo
Have a question about AntMessageBox ? Please use GitHub Issue.
Documentation about AntMessageBox
Fields | Description |
---|---|
title [string] | The title of the message box |
content [string] | The content html |
box [object] |
The container of the jQuery-ui-dialog. Parameters of jQuery ui-dialog are available as follows:
|
callbackOkParams [object] | An object to store parameters to fired callback function on click event of "ok" button of dialog box
|
callbackCancelParams [object] | An object to store parameters to fired callback function on click event of "cancel" button of dialog box |
Methods | Parameters | |
---|---|---|
initDialogBox
Method to define custom settings |
p_title [optionnal string] | The title of the message box. When message dialog box is displayed with an empty title, a default title is used. |
p_elmt [optionnal string] | String to send to jQuery to select the targeted element of DOM to receive the dialog box | |
p_content [optionnal string] | The content html | |
MsgDialogBox
Display basic message box. |
p_content [optionnal string] | The content html |
p_modal [optionnal boolean] | Optional boolean, false by default, to define if the message dialog box is modal or not. | |
AlertDialogBox
Display modal dialog box like alert function of JavaScript. |
p_content [optionnal string] | The content html |
p_ok_click_callback [optionnal function] | Optional or anonymous function, called when click event of button "ok" is fired | |
p_label_ok [optionnal string] | Optional parameter to modify the label of button. "Ok" is the default label. | |
ConfirmDialogBox
Display modal dialog box like confirm function of JavaScript. |
p_content [optionnal string] | The content html |
p_ok_click_callback [optionnal function] | Optional or anonymous function, called when click event of button "ok" is fired | |
p_cancel_click_callback [optionnal function] | Optional or anonymous function, called when click event of button "cancel" is fired | |
p_label_ok [optionnal string] | Optional parameter to modify the label of button. "Ok" is the default label. | |
p_label_cancel [optionnal string] | Optional parameter to modify the label of button. "Cancel" is the default label. |
Samples of AntMessageBox
MsgDialogBox | |
---|---|
Open MsgDialogBox on button click event | Try it |
Open modal MsgDialogBox on button click event | Try it |
Open modal MsgDialogBox, on button click event, with advanced settings and content | Try it |
AlertDialogBox | |
Open AlertDialogBox on button click event with callback function | Try it |
ConfirmDialogBox | |
Open ConfirmDialogBox on button click event with callbacks functions one of which is anonymous | Try it |
Turn ConfirmDialogBox into prompt dialog box | Try it |
Tips of AntMessageBox
How to replace alert function of JavaScript by AlertDialogBox ?
note: AntMessageBox don't stop script during execution like the alert function of JavaScript do. |
How to access to "Ok" button of dialog box ? Buttons are in array. The first button is "Ok" and second is "Cancel". You can access to "Ok" button like this:
|