modalbox

creates a modal box

promise modalbox(string|object text, [string|function type,function callback] );
textstring|objectmandatory, the box text as a string, or the box configuration object
typestring|functionoptional, the type of a modal box or the callback function
callbackfunctionoptional, the callback function (can be used, if the modal box type is defined as a second parameter)
promisethe Promise object

Example

// basic initialization
webix.modalbox("Custom title","alert-error");
 
// extended initialization
webix.modalbox({
    title:"Custom title",
    buttons:["Yes", "No", "Maybe"],
    width:500,
    text:"Any HTML content here"
})
    .then(function(result){
        webix.message(result);
    });

Related samples

Details

The method can be used in 2 main ways:

1. Basic form contains several parameters:

  • title - (string) the text of the header (obligatory),
  • type of the modal box as a string (can be set as "alert-warning" or "alert-error" for warning and error types), or the callback function (optional),
  • callback - (function) the callback function (optional).
webix.modalbox("Custom title","alert-error");
  • Extended form - contains an object with several available parameters. Non-specified parameters take default values.

In the extended form, the method takes one parameter - an object with box parameters. The parameters are:

  • title - (string) the text of the header,
  • text - (string) the box text,
  • type - ("confirm-warning" or "confirm-error") the modalbox type - warning or error,
  • css - (string) the CSS class for styling of the modalbox,
  • buttons - (array) array of button labels,
  • container - (string,HTMLElement) the container for the modalbox,
  • callback - (function) the callback function (optional).
webix.modalbox({
    title:"Title",
    buttons:["Yes", "No", "Maybe"],
    text:"Some text",
    width:500
});

The full list of possible box parameters is given in the related article.

Callbacks

If you really need to, you can also add a callback function. Callback also receives the ID of the button that was clicked.

webix.modalbox({
    title:"Custom title",
    buttons:["Yes", "No", "Maybe"],
    width:500,
    text:"Any HTML content here",
    callback:function(result){
        webix.message(result);
    }
});
See also
Back to top