jsdk-offical

<!doctype html> <html class="default no-js"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>MessageBoxConfig | JSDK 2.7.0 API</title> <meta name="description" content="Documentation for JSDK 2.7.0 API"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="../assets/css/main.css"> </head> <body> <header> <div class="tsd-page-toolbar"> <div class="container"> <div class="table-wrap"> <div class="table-cell" id="tsd-search" data-index="../assets/js/search.json" data-base=".."> <div class="field"> <label for="tsd-search-field" class="tsd-widget search no-caption">Search</label> <input id="tsd-search-field" type="text" /> </div> <ul class="results"> <li class="state loading">Preparing search index...</li> <li class="state failure">The search index is not available</li> </ul> <a href="../index.html" class="title">JSDK 2.7.0 API</a> </div> <div class="table-cell" id="tsd-widgets"> <div id="tsd-filter"> <a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a> <div class="tsd-filter-group"> <div class="tsd-select" id="tsd-filter-visibility"> <span class="tsd-select-label">All</span> <ul class="tsd-select-list"> <li data-value="public">Public</li> <li data-value="protected">Public/Protected</li> <li data-value="private" class="selected">All</li> </ul> </div> <input type="checkbox" id="tsd-filter-inherited" checked /> <label class="tsd-widget" for="tsd-filter-inherited">Inherited</label> <input type="checkbox" id="tsd-filter-externals" checked /> <label class="tsd-widget" for="tsd-filter-externals">Externals</label> <input type="checkbox" id="tsd-filter-only-exported" /> <label class="tsd-widget" for="tsd-filter-only-exported">Only exported</label> </div> </div> <a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a> </div> </div> </div> </div> <div class="tsd-page-title"> <div class="container"> <ul class="tsd-breadcrumb"> <li> <a href="../globals.html">Globals</a> </li> <li> <a href="../modules/js.html">JS</a> </li> <li> <a href="../modules/js.fx.html">fx</a> </li> <li> <a href="js.fx.messageboxconfig.html">MessageBoxConfig</a> </li> </ul> <h1>Class MessageBoxConfig</h1> </div> </div> </header> <div class="container container-main"> <div class="row"> <div class="col-8 col-content"> <section class="tsd-panel tsd-hierarchy"> <h3>Hierarchy</h3> <ul class="tsd-hierarchy"> <li> <span class="target">MessageBoxConfig</span> </li> </ul> </section> <section class="tsd-panel-group tsd-index-group"> <h2>Index</h2> <section class="tsd-panel tsd-index-panel"> <div class="tsd-index-content"> <section class="tsd-index-section "> <h3>Properties</h3> <ul class="tsd-index-list"> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#allowenterkey" class="tsd-kind-icon">allow<wbr>Enter<wbr>Key</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#allowescapekey" class="tsd-kind-icon">allow<wbr>Escape<wbr>Key</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#allowoutsideclick" class="tsd-kind-icon">allow<wbr>Outside<wbr>Click</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#animation" class="tsd-kind-icon">animation</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#backdrop" class="tsd-kind-icon">backdrop</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#background" class="tsd-kind-icon">background</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#cancelbuttonclass" class="tsd-kind-icon">cancel<wbr>Button<wbr>Class</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#cancelbuttoncolor" class="tsd-kind-icon">cancel<wbr>Button<wbr>Color</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#cancelbuttontext" class="tsd-kind-icon">cancel<wbr>Button<wbr>Text</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#confirmbuttonclass" class="tsd-kind-icon">confirm<wbr>Button<wbr>Class</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#confirmbuttoncolor" class="tsd-kind-icon">confirm<wbr>Button<wbr>Color</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#confirmbuttontext" class="tsd-kind-icon">confirm<wbr>Button<wbr>Text</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#customclass" class="tsd-kind-icon">custom<wbr>Class</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#focuscancel" class="tsd-kind-icon">focus<wbr>Cancel</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#focusconfirm" class="tsd-kind-icon">focus<wbr>Confirm</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#footer" class="tsd-kind-icon">footer</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#grow" class="tsd-kind-icon">grow</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#heightauto" class="tsd-kind-icon">height<wbr>Auto</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#html" class="tsd-kind-icon">html</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#imagealt" class="tsd-kind-icon">image<wbr>Alt</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#imageclass" class="tsd-kind-icon">image<wbr>Class</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#imageheight" class="tsd-kind-icon">image<wbr>Height</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#imageurl" class="tsd-kind-icon">image<wbr>Url</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#imagewidth" class="tsd-kind-icon">image<wbr>Width</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#input" class="tsd-kind-icon">input</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputattributes" class="tsd-kind-icon">input<wbr>Attributes</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputautotrim" class="tsd-kind-icon">input<wbr>Auto<wbr>Trim</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputclass" class="tsd-kind-icon">input<wbr>Class</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputoptions" class="tsd-kind-icon">input<wbr>Options</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputplaceholder" class="tsd-kind-icon">input<wbr>Placeholder</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputvalidator" class="tsd-kind-icon">input<wbr>Validator</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#inputvalue" class="tsd-kind-icon">input<wbr>Value</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#keydownlistenercapture" class="tsd-kind-icon">keydown<wbr>Listener<wbr>Capture</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#listeners" class="tsd-kind-icon">listeners</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#position" class="tsd-kind-icon">position</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#reversebuttons" class="tsd-kind-icon">reverse<wbr>Buttons</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#showcancelbutton" class="tsd-kind-icon">show<wbr>Cancel<wbr>Button</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#showclosebutton" class="tsd-kind-icon">show<wbr>Close<wbr>Button</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#showconfirmbutton" class="tsd-kind-icon">show<wbr>Confirm<wbr>Button</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#stopkeydownpropagation" class="tsd-kind-icon">stop<wbr>Keydown<wbr>Propagation</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#target" class="tsd-kind-icon">target</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#text" class="tsd-kind-icon">text</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#timer" class="tsd-kind-icon">timer</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#title" class="tsd-kind-icon">title</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#titletext" class="tsd-kind-icon">title<wbr>Text</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#toast" class="tsd-kind-icon">toast</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#type" class="tsd-kind-icon">type</a></li> <li class="tsd-kind-property tsd-parent-kind-class"><a href="js.fx.messageboxconfig.html#width" class="tsd-kind-icon">width</a></li> </ul> </section> </div> </section> </section> <section class="tsd-panel-group tsd-member-group "> <h2>Properties</h2> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="allowenterkey" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> allow<wbr>Enter<wbr>Key</h3> <div class="tsd-signature tsd-kind-icon">allow<wbr>Enter<wbr>Key<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If set to false, the user can't confirm the modal by pressing the Enter or Space keys, unless they manually focus the confirm button. You can also pass a custom function returning a boolean value.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="allowescapekey" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> allow<wbr>Escape<wbr>Key</h3> <div class="tsd-signature tsd-kind-icon">allow<wbr>Escape<wbr>Key<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If set to false, the user can't dismiss the modal by pressing the Escape key. You can also pass a custom function returning a boolean value, e.g. if you want to disable the escape key for the loading state of a modal.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="allowoutsideclick" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> allow<wbr>Outside<wbr>Click</h3> <div class="tsd-signature tsd-kind-icon">allow<wbr>Outside<wbr>Click<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If set to false, the user can't dismiss the modal by clicking outside it. You can also pass a custom function returning a boolean value, e.g. if you want to disable outside clicks for the loading state of a modal.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="animation" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> animation</h3> <div class="tsd-signature tsd-kind-icon">animation<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If set to false, modal CSS animation will be disabled.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="backdrop" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> backdrop</h3> <div class="tsd-signature tsd-kind-icon">backdrop<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Whether or not SweetAlert2 should show a full screen click-to-dismiss backdrop. Either a boolean value or a css background value (hex, rgb, rgba, url, etc.)</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="background" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> background</h3> <div class="tsd-signature tsd-kind-icon">background<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Modal window background (CSS background property).</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>'#fff'</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="cancelbuttonclass" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> cancel<wbr>Button<wbr>Class</h3> <div class="tsd-signature tsd-kind-icon">cancel<wbr>Button<wbr>Class<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> = "jsfx-btn-cancel"</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>A custom CSS class for the "Cancel"-button.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="cancelbuttoncolor" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> cancel<wbr>Button<wbr>Color</h3> <div class="tsd-signature tsd-kind-icon">cancel<wbr>Button<wbr>Color<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Use this to change the background color of the "Cancel"-button (must be a HEX value).</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>'#aaa'</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="cancelbuttontext" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> cancel<wbr>Button<wbr>Text</h3> <div class="tsd-signature tsd-kind-icon">cancel<wbr>Button<wbr>Text<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Use this to change the text on the "Cancel"-button.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>'Cancel'</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="confirmbuttonclass" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> confirm<wbr>Button<wbr>Class</h3> <div class="tsd-signature tsd-kind-icon">confirm<wbr>Button<wbr>Class<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> = "jsfx-btn-confirm"</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>A custom CSS class for the "Confirm"-button.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="confirmbuttoncolor" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> confirm<wbr>Button<wbr>Color</h3> <div class="tsd-signature tsd-kind-icon">confirm<wbr>Button<wbr>Color<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Use this to change the background color of the "Confirm"-button (must be a HEX value).</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>'#3085d6'</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="confirmbuttontext" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> confirm<wbr>Button<wbr>Text</h3> <div class="tsd-signature tsd-kind-icon">confirm<wbr>Button<wbr>Text<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Use this to change the text on the "Confirm"-button.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>'OK'</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="customclass" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> custom<wbr>Class</h3> <div class="tsd-signature tsd-kind-icon">custom<wbr>Class<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>A custom CSS class for the modal.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="focuscancel" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> focus<wbr>Cancel</h3> <div class="tsd-signature tsd-kind-icon">focus<wbr>Cancel<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Set to true if you want to focus the "Cancel"-button by default.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>false</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="focusconfirm" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> focus<wbr>Confirm</h3> <div class="tsd-signature tsd-kind-icon">focus<wbr>Confirm<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Set to false if you want to focus the first element in tab order instead of "Confirm"-button by default.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="footer" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> footer</h3> <div class="tsd-signature tsd-kind-icon">footer<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">JQuery</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>The footer of the modal, as HTML.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="grow" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> grow</h3> <div class="tsd-signature tsd-kind-icon">grow<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">"row"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"column"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"fullscreen"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">false</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Modal window grow direction</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>false</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="heightauto" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> height<wbr>Auto</h3> <div class="tsd-signature tsd-kind-icon">height<wbr>Auto<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>By default, SweetAlert2 sets html's and body's CSS height to auto !important. If this behavior isn't compatible with your project's layout, set heightAuto to false.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="html" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> html</h3> <div class="tsd-signature tsd-kind-icon">html<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">JQuery</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>A HTML description for the modal. If "text" and "html" parameters are provided in the same time, "text" will be used.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="imagealt" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> image<wbr>Alt</h3> <div class="tsd-signature tsd-kind-icon">image<wbr>Alt<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>An alternative text for the custom image icon.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>''</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="imageclass" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> image<wbr>Class</h3> <div class="tsd-signature tsd-kind-icon">image<wbr>Class<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>A custom CSS class for the customized icon.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="imageheight" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> image<wbr>Height</h3> <div class="tsd-signature tsd-kind-icon">image<wbr>Height<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If imageUrl is set, you can specify imageHeight to describes image height in px.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="imageurl" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> image<wbr>Url</h3> <div class="tsd-signature tsd-kind-icon">image<wbr>Url<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Add a customized icon for the modal. Should contain a string with the path or URL to the image.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="imagewidth" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> image<wbr>Width</h3> <div class="tsd-signature tsd-kind-icon">image<wbr>Width<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If imageUrl is set, you can specify imageWidth to describes image width in px.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="input" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input</h3> <div class="tsd-signature tsd-kind-icon">input<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">"text"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"email"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"password"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"number"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"tel"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"range"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"textarea"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"select"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"radio"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"checkbox"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"file"</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">"url"</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Input field type, can be text, email, password, number, tel, range, textarea, select, radio, checkbox, file and url.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputattributes" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Attributes</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Attributes<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{}</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>HTML input attributes (e.g. min, max, step, accept...), that are added to the input field.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> <div class="tsd-type-declaration"> <h4>Type declaration</h4> <ul class="tsd-parameters"> <li class="tsd-parameter-index-signature"> <h5><span class="tsd-signature-symbol">[</span>attribute: <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">]: </span><span class="tsd-signature-type">string</span></h5> </li> </ul> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputautotrim" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Auto<wbr>Trim</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Auto<wbr>Trim<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Automatically remove whitespaces from both ends of a result string. Set this parameter to false to disable auto-trimming.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>true</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputclass" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Class</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Class<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>A custom CSS class for the input field.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputoptions" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Options</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Options<span class="tsd-signature-symbol">:</span> <a href="../modules/js.lang.html#jsonobject" class="tsd-signature-type">JsonObject</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">></span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>If input parameter is set to "select" or "radio", you can provide options. Object keys will represent options values, object values will represent options text values.</p> </div> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputplaceholder" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Placeholder</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Placeholder<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Input field placeholder.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>''</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputvalidator" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Validator</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Validator<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">(</span>inputValue<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol">></span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Validator for input field, may be async (Promise-returning) or sync.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>null</p> </dd> </dl> </div> <div class="tsd-type-declaration"> <h4>Type declaration</h4> <ul class="tsd-parameters"> <li class="tsd-parameter-signature"> <ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-property"> <li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>inputValue<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol">></span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>inputValue: <span class="tsd-signature-type">string</span></h5> </li> </ul> <h4 class="tsd-returns-title">Returns <a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">null</span><span class="tsd-signature-symbol">></span></h4> </li> </ul> </li> </ul> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="inputvalue" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> input<wbr>Value</h3> <div class="tsd-signature tsd-kind-icon">input<wbr>Value<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Input field initial value.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>''</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="keydownlistenercapture" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> keydown<wbr>Listener<wbr>Capture</h3> <div class="tsd-signature tsd-kind-icon">keydown<wbr>Listener<wbr>Capture<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Useful for those who are using SweetAlert2 along with Bootstrap modals. By default keydownListenerCapture is false which means when a user hits Esc, both SweetAlert2 and Bootstrap modals will be closed. Set keydownListenerCapture to true to fix that behavior.</p> </div> <dl class="tsd-comment-tags"> <dt>default</dt> <dd><p>false</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-class"> <a name="listeners" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagOptional">Optional</span> listeners</h3> <div class="tsd-signature tsd-kind-icon">listeners<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span>closed<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>closing<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, modal<span class="tsd-signature-symbol">: </span><a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>confirming<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, inputValue<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">></span><span class="tsd-signature-symbol">; </span>opened<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, modal<span class="tsd-signature-symbol">: </span><a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">; </span>opening<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, modal<span class="tsd-signature-symbol">: </span><a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol"> }</span></div> <aside class="tsd-sources"> </aside> <div class="tsd-type-declaration"> <h4>Type declaration</h4> <ul class="tsd-parameters"> <li class="tsd-parameter"> <h5><span class="tsd-flag ts-flagOptional">Optional</span> closed<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5> <ul class="tsd-parameters"> <li class="tsd-parameter-signature"> <ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable"> <li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>e: <span class="tsd-signature-type">Event</span></h5> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </li> </ul> </li> <li class="tsd-parameter"> <h5><span class="tsd-flag ts-flagOptional">Optional</span> closing<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, modal<span class="tsd-signature-symbol">: </span><a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5> <ul class="tsd-parameters"> <li class="tsd-parameter-signature"> <ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable"> <li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, modal<span class="tsd-signature-symbol">: </span><a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>e: <span class="tsd-signature-type">Event</span></h5> </li> <li> <h5>modal: <a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a></h5> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </li> </ul> </li> <li class="tsd-parameter"> <h5><span class="tsd-flag ts-flagOptional">Optional</span> confirming<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, inputValue<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">></span></h5> <ul class="tsd-parameters"> <li class="tsd-parameter-signature"> <ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable"> <li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, inputValue<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">></span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>e: <span class="tsd-signature-type">Event</span></h5> </li> <li> <h5>inputValue: <span class="tsd-signature-type">any</span></h5> </li> </ul> <h4 class="tsd-returns-title">Returns <a href="../interfaces/promise.html" class="tsd-signature-type">Promise</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">></span></h4> </li> </ul> </li> </ul> </li> <li class="tsd-parameter"> <h5><span class="tsd-flag ts-flagOptional">Optional</span> opened<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-symbol">(</span>e<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Event</span>, modal<span class="tsd-signature-symbol">: </span><a href="../interfaces/htmlelement.html" class="tsd-signature-type">HTMLElement</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span></h5> <ul class="tsd-parameters"> <li class="tsd-parameter-signature"> <ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable"> <li class="tsd-signature