Wiki

Simple

Provide only the message to show, and keep all other things default.

#!php
<?php

new \mdscomp\BootstrapDialog\Dialog([
    'message'  => 'Just message',
]);

?>

Alert

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'modal'    => 'alert',
    'message'  => 'This is alert'
]);

?>

Alert with Callback

You can provide javascript into string in callback config. It will be converted into javascript automatically.

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'modal'    => 'alert',
    'message'  => 'This is alert',
    'callback' => 'function(dialog){alert(\'this dialog alert\')}'
]);

?>

Confirm

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'modal'    => 'confirm',
    'message'  => 'Are you sure?'
]);

?>

Confirm with Callback

You can provide javascript into string in callback config. It will be converted into javascript automatically.

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'modal'    => 'confirm',
    'message'  => 'Are you sure?',
    'callback' => 'function(result){if(result) {alert(\'Yup.\');}else {alert(\'Nope.\');}}'
]);

?>

You can read another example from Bootstrap3 Dialog. Just remember to convert javascript into string to use javascript within code. Example for buttons action, you must convert your javascript into string.

Options

I added a few options besides the main options, you can read main options on Bootstrap3 Dialog. You must include them into config array.

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'id'       => 'dialogId', // you can call this id directly without javascript selector. Ex: `dialogId.open()` in javascript code.
    'js'       => false, // if true, it will be create dialog javascript on your current code block.
    'callable' => false, // if true, then will create modal in "hidden" state with an `instance` and then you can call it manually within your code.
    'modal'    => 'normal', // default value is `normal`, you can change this into another options to create another type. The options is `normal`, `alert`, `confirm`.
]);

?>

To use js and callable, you must provide $dialog.open() in php code to call the dialog. If you not provide it, the script itself won't rendered. js options can be use for any dialog, and callable only for normal dialog.

Method

register($type)

This will generate dialog javascript code where ever you echo() this method. You MUST use js => true to generate code, or script will fail. REMEMBER this method ONLY generate dialog code, without open() or another function. To make easy for you to call the dialog, give id => 'YourDialogId' on config, and call or set another option later with dialog_YourDialogId. Example :

#!php
<?php
$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'id'       => 'JustSomeDialog',
    'js'       => true,
    'callable' => true,
    'title'    => 'Test Dialog Title',
    'message'  => 'Test Dialog Message',
    'buttons'  => [
        [
            'label'  => 'OK',
            'action' => 'function(dialog){console.log(\'button pressed\')}',
        ]
    ],
]);
?>
    <script type="text/javascript">
        <?php $this->beginBlock('JS_END') ?>
        function DialogFunction() {
            <?= $dialog->register('js') ?>
            dialog_JustSomeDialog.open();
        }
        <?php $this->endBlock(); ?>
    </script>
<?php

And here is generated code :

#!html
<script type="text/javascript">
    function DialogFunction() {
        var dialog_JustSomeDialog = new BootstrapDialog({
            "type": "type-default",
            "size": "size-normal",
            "cssClass": "",
            "nl2br": true,
            "closable": true,
            "closeByBackdrop": true,
            "closeByKeyboard": true,
            "spinicon": "glyphicon glyphicon-asterisk",
            "autodestroy": true,
            "draggable": true,
            "animate": true,
            "description": false,
            "title": "Test Dialog Title",
            "message": "Test Dialog Message",
            "buttons": [{
                "label": "OK",
                "action": function(dialog) {
                    console.log('button pressed')
                }
            }]
        });
        dialog_JustSomeDialog.open();
    }    
</script>

open($type)

open($type) this will create dialog.open() in javascript. But in php, you must provide $type with $this if you want to call dialog in view or js if you want to render javascript into some js function. Example :

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'callable' => true,
    'title'    => 'Logout',
    'buttons'  => [
        [
            'label'  => 'OK',
            'action' => 'function(dialog){console.log(\'button pressed\')}',
        ]
    ],
]);

?>
    <script type="text/javascript">
        <?php $this->beginBlock('JS_END') ?>
        function ForceLogout() {
            <?= $dialog->open('js') ?>
        }
        <?php $this->endBlock(); ?>
    </script>
<?php

if you see in that example, dialog were coded before <script> tag, and if you check into your code, then here is your generate code:

#!html

<script type="text/javascript">
    var dialog_w5 = new BootstrapDialog({
        "type": "type-default",
        "size": "size-normal",
        "cssClass": "",
        "nl2br": true,
        "closable": true,
        "closeByBackdrop": true,
        "closeByKeyboard": true,
        "spinicon": "glyphicon glyphicon-asterisk",
        "autodestroy": true,
        "draggable": true,
        "animate": true,
        "description": false,
        "title": "Logout",
        "message": "null",
        "buttons": [{
            "label": "OK",
            "action": function(dialog) {
                console.log('button pressed')
            }
        }]
    });

    function ForceLogout() {
        dialog_w5.open();
    }
</script>

but, if you want generate dialog inside <script> or javascript function, use options js => true on dialog config. Here is example :

#!php
<?php

$dialog = new \mdscomp\BootstrapDialog\Dialog([
    'js'       => true,
    'callable' => true,
    'title'    => 'Logout',
    'buttons'  => [
        [
            'label'  => 'OK',
            'action' => 'function(dialog){console.log(\'button pressed\')}',
        ]
    ],
]);

?>
    <script type="text/javascript">
        <?php $this->beginBlock('JS_END') ?>
        function ForceLogout() {
            <?= $dialog->open('js') ?>
        }
        <?php $this->endBlock(); ?>
    </script>
<?php

and here is the generate code :

#!html
<script type="text/javascript">
    function ForceLogout() {
        var dialog_w5 = new BootstrapDialog({
            "type": "type-default",
            "size": "size-normal",
            "cssClass": "",
            "nl2br": true,
            "closable": true,
            "closeByBackdrop": true,
            "closeByKeyboard": true,
            "spinicon": "glyphicon glyphicon-asterisk",
            "autodestroy": true,
            "draggable": true,
            "animate": true,
            "description": false,
            "title": "Logout",
            "message": "null",
            "buttons": [{
                "label": "OK",
                "action": function(dialog) {
                    console.log('button pressed')
                }
            }]
        });;
        dialog_w5.open();
    }
</script>