Yii2 刪除確認模態

Question

我正在嘗試使用 yii2 制作刪除確認模式。 我有一個帶有操作按鈕的網格視圖，可以刪除網格視圖的項目。

當用戶單擊此按鈕時，會出現一個彈出式模式，我無法獲取必須刪除的項目的 id。

這是我的 gridview 的代碼（只有操作按鈕）：

'buttons' => [
                'view' => function ($url, $model) {
                            return Html::a('', $url, ['class' => 'btn btn-success btn-xs glyphicon glyphicon-eye-open']);
                        },
            'edit'   => function ($url, $model) {
                            if (Yii::$app->user->getIdGroupe() != 1)
                            {
                                return Html::a('');
                            }
                            return Html::a('', $url, ['class' => 'btn btn-warning btn-xs glyphicon glyphicon-pencil']);
                        },
                        'delete' => function ($url, $model) {
                            return Html::a('', $url, ['class' => 'btn btn-danger btn-xs glyphicon glyphicon-trash', 'data-toggle' => 'modal', 'data-target' => '#modal', 'data-id' => $model->idRessource, 'id' => 'popupModal']);
                        },
                ],
'urlCreator'  => function ($action, $model, $key, $index) {
                            if ($action == 'view') {
                                $url = Url::to(['/ressource/view', 'id' => $model->idRessource]);
                            } else if ($action == 'edit') {
                                $url = Url::to(['/ressource/edit', 'id' => $model->idRessource]);
                            } else {
                                $url = '#';
                            }
                            return $url;
                    },

然后是模態：

<?php $url = Url::to(['ressource/delete']); ?>

<?php Modal::begin([
    'header' => '<h2 class="modal-title"></h2>',
    'id'     => 'modal-delete',
    'footer' => Html::a('Supprimer', $url, ['class' => 'btn btn-danger']),
]); ?>

<?= 'Etes vous sur de vouloir supprimer la ressource ...'; ?>

<?php Modal::end(); ?>

最后是 javascript ：

<?php
$this->registerJs("$(function() {
   $('#popupModal').click(function(e) {
        e.preventDefault();
        $('#modal-delete').modal('show').find('.modal-body')
        .load($('.modal-dialog'));
        var modal = $(this);
        var triggered = $(e.relatedTarget);
        var id = triggered.data('id');
        $('.modal-title').text('Supprimer la ressource ' + id);
   });
});"); ?>

問題是我無法獲得項目的 id，我在構建 $url 時需要它，因為操作“actionDelete”需要項目的 id。

希望它很清楚，你將能夠幫助我！ 謝謝

Answer 1

PHP按鈕：

'delete' => function ($url, $model) {
    return Html::a('', $url, [
        'class' => '... popup-modal', 
        'data-toggle' => 'modal', 
        'data-target' => '#modal', 
        'data-id' => $model->idRessource, 
        'id' => 'popupModal-'. $model->idRessource
    ]);
},

JS：

<?php
$this->registerJs("$(function() {
$('.popup-modal').click(function(e) {
    e.preventDefault();
    var modal = $('#modal-delete').modal('show');
    modal.find('.modal-body').load($('.modal-dialog'));
    var that = $(this);
    var id = that.data('id');
    modal.find('.modal-title').text('Supprimer la ressource ' + id);
});
});"); 
?>

Answer 2

我自己找到了解決方案，感謝@XiaosongGuo所以這里是完整的答案

我的刪除按鈕：

'delete' => function ($url, $model) {
    return Html::a('', $url, [
        'class'       => 'btn btn-danger btn-xs glyphicon glyphicon-trash popup-modal',
        'data-toggle' => 'modal',
        'data-target' => '#modal',
        'data-id'     => $model->idRessource,
        'data-name'   => $model->nomRessource,
        'id'          => 'popupModal',
    ]);
},

我的網址創建者：

'urlCreator'     => function ($action, $model, $key, $index) {
    $url = Url::to(['/ressource/delete', 'id' => $model->idRessource]);
    return $url;
},

我的模態：

<?php Modal::begin([
    'header' => '<h2 class="modal-title"></h2>',
    'id'     => 'modal-delete',
    'footer' => Html::a('Supprimer', '', ['class' => 'btn btn-danger', 'id' => 'delete-confirm']),
]); ?>

<?= 'Etes vous sur de vouloir supprimer cette ressource ?'; ?>

<?php Modal::end(); ?>

最后是JavaScript：

<?php
$this->registerJs("
    $(function() {
        $('.popup-modal').click(function(e) {
            e.preventDefault();
            var modal = $('#modal-delete').modal('show');
            modal.find('.modal-body').load($('.modal-dialog'));
            var that = $(this);
            var id = that.data('id');
            var name = that.data('name');
            modal.find('.modal-title').text('Supprimer la ressource \"' + name + '\"');

            $('#delete-confirm').click(function(e) {
                e.preventDefault();
                window.location = 'delete?id='+id;
            });
        });
    });"
);

如果你有比我的答案更好的解決方案，請不要猶豫告訴我！

感謝大家的幫助:)

Answer 3

是否可以將id放在模型url中，類似於：

<?php $url = Url::to(['ressource/delete', 'id' => $model->id]); ?>

Answer 4

看來 Yii 已經有用於提示確認對話框的 javascript 和按鈕/鏈接的 PHP Helper。

參考： yii helpers Html類和yii2的yii.js實現的post請求的簡單分析

粘貼以下代碼以供快速參考：

<?= Html::a(
      'delete',
      [
          'delete',
          'id' => $id,
      ],
      [
          'data' => [
              'confirm' => 'Are you sure you want to delete it?',
              'method' => 'post',
          ],
      ]  ) 
?>