Use this to change the background color of the "Cancel"-button. Use this to change the background color of the "Deny"-button. Use this to change the background color of the "Confirm"-button. Use this to change the text on the "Cancel"-button. Use this to change the text on the "Deny"-button. Use this to change the text on the "Confirm"-button. If set to true, a "Cancel"-button will be shown, which the user can click on to dismiss the modal. It can be useful when you want a popup with 3 buttons. If set to true, a "Deny"-button will be shown.
If set to false, a "Confirm"-button will not be shown. Set keydownListenerCapture to true to fix that behavior. By default keydownListenerCapture is false which means when a user hits Esc, both SweetAlert2 and Bootstrap modals will be closed.
Useful for those who are using SweetAlert2 along with Bootstrap modals. If set to false, SweetAlert2 will allow keydown events propagation to the document. You can also pass a custom function returning a boolean value. If set to false, the user can't confirm the popup by pressing the Enter or Space keys, unless they manually focus the confirm button. if you want to disable the Esc key for the loading state of a popup. You can also pass a custom function returning a boolean value, e.g. If set to false, the user can't dismiss the popup by pressing the Esc key. if you want to disable outside clicks for the loading state of a popup. If set to false, the user can't dismiss the popup by clicking outside it. If this behavior isn't compatible with your project's layout, set heightAuto to false. Mostly, this feature is useful with toasts.īy default, SweetAlert2 sets html's and body's CSS height to auto !important. If set to true, the timer will have a progress bar at the bottom of a popup. See also Swal.getTimerLeft(), Swal.stopTimer(), Swal.resumeTimer(), Swal.toggleTimer(), Swal.isTimerRunning() and Swal.increaseTimer(). Paired with window position, sets the direction the popup should grow in, can be set to 'row', 'column', 'fullscreen', or false.Īuto close timer of the popup. Popup window position, can be 'top', 'top-start', 'top-end', 'center', 'center-start', 'center-end', 'bottom', 'bottom-start', or 'bottom-end'. Popup window background (CSS background property). The default padding is 1.25rem.Ĭolor for title, content and footer (CSS color property). Popup window width, including paddings ( box-sizing: border-box). The container element for adding popup into. This option is normally coupled with the position parameter and a timer.
Whether or not an alert should be treated as a toast notification. Can be either a boolean or a string which will be assigned to the CSS background property.
#Extra parameter scriptcase full
Whether or not SweetAlert2 should show a full screen click-to-dismiss backdrop. Use this to change the color of the icon.ĬSS classes for animations when showing a popup (fade in)ĬSS classes for animations when hiding a popup (fade out) It can either be put in the array under the key "icon" or passed as the third parameter of the function. SweetAlert2 comes with 5 built-in icon which will show a corresponding icon animation: warning, error, success, info, and question. It is the developer's responsibility to escape any user input when using the html option, so XSS attacks would be prevented. SweetAlert2 does NOT sanitize this parameter. If text and html parameters are provided in the same time, html will be used. Here are the keys that you can use if you pass an object into sweetAlert2: