帶Codeigniter的Sweet Alert用於刪除事件

Question

我在使我的代碼點火器代碼，我擁有的客戶模塊索引（代碼的一部分）上工作時遇到問題：

 <table class="table table-striped"> <tr> <td>ID</td> <td>Empresa</td> <td>Contacto</td> <td>RNC</td> <td>Telefono</td> <td>Email</td> <td>Acciones</td> </tr> <?php foreach($clientes as $c): ?> <tr> <td><?php echo $c['id']; ?></td> <td><?php echo $c['empresa']; ?></td> <td><?php echo $c['contacto']; ?></td> <td><?php echo $c['rnc']; ?></td> <td><?php echo $c['telefono']; ?></td> <td><?php echo $c['email']; ?></td> <td> <a href="<?php echo site_url('clientes/edit/'.$c['id']); ?>" class="btn btn-info">Editar</a> <a href="<?php echo site_url('clientes/delete/'.$c['id']); ?>" class="btn btn-danger">Eliminar</a> <a href="<?php echo site_url('clientes/view/'.$c['id']); ?>" class="btn btn-danger">Ver</a> </td> </tr> <?php endforeach; ?> </table> 

然后我在我的js中有這個：

$('#AlertaEliminarCliente').on("click", function() {
  swal({
      title: "Está seguro?",
      text: "No podrá recuperar el cliente una vez sea eliminado!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: '#DD6B55',
      confirmButtonText: 'Si, Eliminarlo!',
      cancelButtonText: "No, Cancelar!",
      confirmButtonClass: "btn-danger",
      closeOnConfirm: false,
      closeOnCancel: false
    },
    function(isConfirm) {
      if (isConfirm) {
        swal("Eliminado!", "Su cliente ha sido eliminado!", "success");
      } else {
        swal("Cancelado", "Su cliente está a salvo! :)", "error");
      }
    });
});

如何將ID #AlertaEliminarCliente添加到我的按鈕中

我試圖添加它，它只是刪除行而不要求確認等。從甜蜜的警報中，我是否缺少某些東西？ 任何指導其表示贊賞，謝謝您的時間！

Answer 1

單擊該按鈕會將用戶帶到url clientes/delete/'.$c['id']無論用戶是否與甜蜜警報進行交互。 您需要修改jQuery以防止url更改，並且僅根據用戶選擇的最佳警報提示來重定向用戶。

$('#AlertaEliminarCliente').on("click", function(e) {
  e.preventDefault();
  var url = $(this).attr('href');
  swal({
      title: "Está seguro?",
      text: "No podrá recuperar el cliente una vez sea eliminado!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: '#DD6B55',
      confirmButtonText: 'Si, Eliminarlo!',
      cancelButtonText: "No, Cancelar!",
      confirmButtonClass: "btn-danger",
      closeOnConfirm: false,
      closeOnCancel: false
    },
    function(isConfirm) {
      if (isConfirm) {
        swal("Eliminado!", "Su cliente ha sido eliminado!", "success");
        window.location.replace(url);
      } else {
        swal("Cancelado", "Su cliente está a salvo! :)", "error");
      }
    });
});

您可能需要設置超時，以便在更改網址之前仍顯示最終消息

setTimeout(function(){ window.location.replace = url; }, 2000);

最后說明：如果打算在頁面上的多個元素上使用此方法，則應使用.AlertaEliminarCliente而不是#AlertaEliminarCliente

Answer 2

要停止默認操作（刪除操作），請放置event.preventDefault(); 在您的功能開始時。 這將阻止按鈕（或鏈接）動作的發生。

$('#AlertaEliminarCliente').on("click", function(event) {
  event.preventDefault();
  swal({...

另外，我看不到您有使用id AlertaEliminarCliente的元素。 我認為您希望在此代碼行中使用它。

<a href="<?php echo site_url('clientes/delete/'.$c['id']); ?>" 
    class="btn btn-danger" id="AlertaEliminarCliente">Eliminar</a>