Встановлюємо bootBox.js (bootboxjs.com) за допомогою composer, для цього відкриваємо консоль, переходимо в папку з проєктом і запускаємо таку команду:
composer require --prefer-dist bower-asset/bootbox "*"
Далі створюємо файл з ім'ям BootboxAsset.php поруч з AppAsset.php у папці assets вашого проєкту, для підключення необхідних скриптів, з таким змістом:
<?php namespace app\assets; class BootboxAsset extends \yii\web\AssetBundle { public $sourcePath = '@bower/bootbox'; public $css = [ ]; public $js = [ 'bootbox.js' ]; }
Після чого, нам необхідно перевизначити стандартний yii.confirm. Для цього створіть папку js (якщо її ще немає) у вашому проекті @app/web/js, а в ній js файл yii.confirm.overrides.js з таким вмістом:
yii.confirm = function(message, ok, cancel) { bootbox.confirm(message, function(result) { if (result) { !ok || ok(); } else { !cancel || cancel(); } }); }
Далі додамо js файл у Yii2-asset-bundle. Для цього відкрийте @app/assets/AppAsset.php, додайте до нього js файл yii.confirm.overrides.js та залежність BootboxAsset для підключення необхідних скриптів до сайту. Файл @app/assets/AppAsset.php матиме такий вигляд:
<?php namespace app\assets; use yii\web\AssetBundle; class AppAsset extends AssetBundle { public $basePath = '@webroot'; public $baseUrl = '@web'; public $css = [ 'css/site.css', ]; public $js = [ //js перевизначає yii.confirm 'js/yii.confirm.overrides.js', ]; public $depends = [ 'yii\web\YiiAsset', 'yii\bootstrap\BootstrapAsset', //імпорт файлів BootboxAsset 'app\assets\BootboxAsset', ]; }
На цьому все. Давайте перевіримо, відкриємо будь-який список управління записами і натиснемо видалити для виклику діалогу підтвердження. До внесення змін було так:
Після того як ми підключили BootboxAsset:
Приклад виклику confirm діалогу для кнопки:
<?php use yii\helpers\Html; //... echo Html::submitButton( 'Кнопка', [ 'class' => 'btn', 'data-confirm' => Yii::t('yii', 'Ви точно хочете це зробити?'), ] );
Приклад наведено для yii2 basic, але впровадити його для advanced шаблону не складе труднощів.