我在我的项目中使用yii2mod/yii2-sweet-alert,我在基本和高级主题上使用它,我喜欢它。
问题。 如何更改纯粹的javascript确认网格默认确认对话框,以便使用Sweet-alert使其看起来更好?
我已经尝试修改按钮的模板以进行删除,因为如果要更改消息,您将执行以下操作:
[
'class' => ActionColumn::className(),
'template' => '{update}{delete}',
'buttons' => [
'delete' => function($url, $model){
return Html::a('<span class="glyphicon glyphicon-trash"></span>', ['delete', 'id' => $model->id], [
'class' => '',
'data' => [
'confirm' => 'Are you absolutely sure ? You will lose all the information about this user with this action.',
'method' => 'post',
],
]);
}
]
]
但我没有成功将确认消息从javascript更改为甜蜜警报。
此外,我正在尝试作为第二个选项,使其与Krajee/ Grid and actionColumn一起使用,但仍然可以使其工作«这是我正在工作的第二个选项,执行此操作»。
[
'class' => 'kartik\grid\ActionColumn',
'viewOptions' => ['hidden' => true],
'updateOptions' => ['title' => 'Edit events', 'data-toggle' => '??'],
'deleteOptions' => ['title' => 'delete your event', 'data-toggle' => 'I am Lost here'],
],
请知道如何改变这种行为?
更多关于如何解决问题 - 感谢 @muhammad-omer-aslam
在您的公用文件夹上创建一个js文件,在我的情况下为
/backend/web/js/confirmSwal.js
并添加提供的代码:
添加这些行
yii.confirm = function (message, okCallback, cancelCallback) {
swal({
title: message,
type: 'warning',
showCancelButton: true,
closeOnConfirm: true,
allowOutsideClick: true
}, okCallback);
};
将此添加到您的AppAssets
/backend/assets/AppAssets.php
public $js = [
'/js/confirmSwal.js',
];
这就是它很漂亮。
再次感谢穆罕默德。
答案 0 :(得分:4)
<强> UPDATE2 强>
只需更正您需要执行的代码
okCallback.call()
或添加括号()
,例如'okCallback()`cancelCallback.call()
或添加括号cancelCallback()
在.then((selection)=>{})
内,它是一个匿名函数,需要调用而不是仅使用okCallback
,因此.then((selection)=>{})
中的代码变为
if(selection){ okCallback.call();}else{ cancelCallback.call();}
<强>更新强>
sweetalert 2.0
版本
callback
赞成promise
:
如果用户单击确认按钮,则承诺将解析为true
。如果警报被取消(通过在其外部点击),则承诺将解析为null
。
allowClickOutside
现在closeOnClickOutside
为了清晰起见。
showCancelButton
和showConfirmButton
不再需要。相反,您可以将buttons: true
设置为显示两个按钮,或设置buttons: false
以隐藏所有按钮。默认情况下,仅显示确认按钮。swal("Hello world!")
)时,该参数将是模式的text
而不是title
。type
和imageUrl
已替换为单个icon
选项。如果您使用的是速记版本(swal("Hi", "Hello world", "warning")
),则无需进行任何更改。因此,如果您使用ver 2.x
或从1.x
升级,则可以将代码更改为以下内容。
yii.confirm = function (message, okCallback, cancelCallback) {
swal({
text: message,
icon: 'warning',
buttons : {
cancel : {
text : "Oops! No",
value : null,
visible : true,
className : "",
closeModal : true
},
confirm : {
text : "Delete It Already",
value : true,
visible : true,
className : "",
closeModal : true
}
},
closeOnClickOutside: true
}).then((selection) => {
if(selection){okCallback;}else{cancelCallback;}
});
}
您可以使用以下代码覆盖Yii2默认data-confirm
弹出窗口:
基础是包含资产,然后添加这个JS:
/**
* Override the default yii confirm dialog. This function is
* called by yii when a confirmation is requested.
*
* @param message the message to display
* @param okCallback triggered when confirmation is true
* @param cancelCallback callback triggered when canceled
*/
yii.confirm = function (message, okCallback, cancelCallback) {
swal({
title: message,
type: 'warning',
showCancelButton: true,
closeOnConfirm: true,
allowOutsideClick: true
}, okCallback);
};