
Устанавливаем sweetAlert с помощью composer, для этого открываем консоль, переходим в папку с проектом и запускаем следующую команду:
- composer require -- prefer - dist bower - asset / sweetalert "*"
Далее создаем файл с именем SweetAlertAsset.php рядом с AppAsset.php в папке assets вашего проекта со следующим содержанием:
- <? php
- namespace app\assets ;
- class SweetAlertAsset extends \yii\web\AssetBundle
- {
- public $sourcePath = '@bower/sweetalert/dist' ;
- public $css = [
- 'sweetalert.css' ,
- ];
- public $js = [
- 'sweetalert.min.js'
- ];
- }
Стандартный yii.confirm находится в app/vendor/yiisoft/yii2/assets/yii.js и выглядит следующим образом:
- /**
- * Displays a confirmation dialog.
- * The default implementation simply displays a js confirmation dialog.
- * Вы можете override this by setting `yii.confirm`.
- * @param message the confirmation message.
- * @param ок callback to be called when the user confirms the message
- * @param cancel a callback to call when the user cancels the confirmation
- */
- confirm : function ( message , ok , cancel ) {
- if ( confirm ( message )) {
- ! ок || ok ();
- } else {
- ! cancel ||
- }
- },
Нам необходимо переопределить стандартный yii.confirm . Для этого создайте папку js (если ее еще нет) в вашем проекте @app/web/js , а в ней js файл yii.confirm.overrides.js со следующим содержимым:
- /**
- * Override the default yii confirm dialog. Эта функция is
- * Called by yii когда confirmation is requested.
- *
- * @param string message the message to display
- * @param string ok callback triggered когда confirmation is true
- * @param string cancelCallback callback triggered when cancelled
- */
- yii . confirm = function ( message , okCallback , cancelCallback ) {
- swal ({
- title : message ,
- type : 'warning' ,
- showCancelButton : true ,
- closeOnConfirm : true ,
- allowOutsideClick : true
- }, okCallback );
- };
Далее добавим js файл в Yii2-asset-bundle. Для этого откройте assets/AppAsset.php , добавьте к нему js файл yii.confirm.overrides.js и зависимость SweetAlertAsset для подключения необходимых скриптов и стилей в проект. Файл 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' ,
- //импорт файлов SweetAlertAsset
- 'app\assets\SweetAlertAsset' ,
- ];
- }
На этом все. Давайте проверим, откроем любой список управления записями и нажмем удалить диалог подтверждения. Как было раньше:
Сейчас вместо стандартного confirm:
Это также будет работать при использовании кнопок в коде проекта:
- <? php
- use yii\helpers\Html ;
- //...
- echo Html :: submitButton (
- 'Кнопка' ,
- [
- 'class' => 'btn' ,
- 'data-confirm' => Yii :: t ( 'yii' , 'Вы точно хотите это сделать?' ),
- ]
- );
Вот так легко можно поменять стандартный диалог confirm в yii2