Full functionality of SimpleBsDialog.
Please note that all options described below are optional, but you will have a weird dialog if you don't even give it a title to display.
Most options can be set via init options or property setters.
| Option | Type | Default value | Description |
|---|---|---|---|
| width | String or Integer | 500 |
The dialog's width in pixels or percent. Examples:
SimpleBsDialog.show({
width: '900px',
});
SimpleBsDialog.show({
width: '70%',
});
SimpleBsDialog.show({
width: '600',
});
|
| autoWidth | Boolean | false |
Enables resizing the dialog when the document is resized. It applies only when the 'width' value is set in percent.
SimpleBsDialog.show({
width: '80%',
autoWidth: true,
});
|
| height | String or Integer | 280 |
The dialog's height in pixels or percent. Examples:
SimpleBsDialog.show({
height: '300px',
});
SimpleBsDialog.show({
height: '60%',
});
|
| autoHeight | Boolean | false |
Enables resizing the dialog when the document is resized. It applies only when the 'height' value is set in percent.
SimpleBsDialog.show({
height: '60%',
autoHeight: true,
});
|
| title | String | The dialog's title. | |
| closable | Boolean | true | Show|hide the close button at the top right corner. |
| spinner | Boolean | false | Show|hide the spinner icon. |
| spinnerIcon | String |
|
Set the spinner's icon. |
| closeByBackdrop | Boolean | true | When it's true, you can close it by clicking outside the dialog. |
| closeByKeyboard | Boolean | true | When it's true, you can close it by pressing the ESC key. |
| html | String | The dialog's content. | |
| cssClass | String | Additional css classes that will be added to your dialog. | |
| buttons | Array |
Example:
SimpleBsDialog.show({
buttons: [{
id: 'btn-ok',
label: 'OK',
cssClass: 'btn-primary',
action: function(dialogRef) {
dialogRef.close();
},
},
],
});
id: optional, otherwise a random id will be generated.label: optional, the button's title. cssClass: optional, additional css class to be added to the button. action: optional, if provided, the callback will be invoked after the button is clicked, and the dialog instance will be passed to the callback function. |
|
| onShow | function | If provided, it will be invoked when the dialog is popping up. | |
| onShown | function | If provided, it will be invoked when the dialog is popped up. | |
| onHide | function | If provided, it will be invoked when the dialog is popping down. | |
| onHidden | function | If provided, it will be invoked when the dialog is popped down. |