Подтвердите сообщение, прежде чем удален

Question

Я хотел бы иметь подтверждение перед удалением кода file.My без подтверждения, который работает как этот

<form action="delete.php" method="get"> 
<table> 
<?php 
    foreach ($files as $file) { 
        ?> 
<tr> 
     <td><?php echo $fajl['file_name'];?></td> 
     <td><a href="delete.php?id=<?php echo $file['file_id'];?>"><img src="img/delete.png"/></a></td> 
    </tr> 
     <?php } ?> 
     </table> 
    </form> 

часть из delete.php

...if(isset($_GET['id'])){ 
    $id = $_GET['id']; 
    $query = $pdo->prepare('DELETE FROM files WHERE file_id = ?'); 
    $query->bindValue(1, $id); 
    $query->execute(); 
} 
$files = $file->fetch_all(); 
... 

и когда я нажимаю на удаление файла изображения, удаляется. он отлично работает, но я хотел бы получить подтверждение перед удалением файла. Я пытался сделать это с Зебра диалога добавить класс = «удалить»

<a href="delete.php?id=<?php echo $file['file_id'];?>"><img class="delete" src="img/delete.png"/></a> 

и следующий код

<script> 
    $(document).ready(function() { 
$(".delete").bind("click", function (e) { 
    e.preventDefault(); 
    var $this = $(this); 
    $.Zebra_Dialog("Do you want to delete this file?", { 
     type: "question", 
     title: "Are you sure?", 
     buttons: ['Yes', 'No'], 
     onClose: function (caption) { 
      if (caption == 'Yes') { 
       $.ajax({ 
        url: 'delete.php', 
        data: { 
         id: $this.data('id'), 
         success: function(data){ 
      alert("File deleted"); 
     } 
        } 
       }) 
      } 
     } 
    }) 
}); 
}); 
    </script> 

но это не работает ... P.S. Теперь я увидел, что Zebra диалог имеет опцию

'buttons': [ 
       {caption: 'Yes', callback: function() { alert('"Yes" was clicked')}}, 
       {caption: 'No'}, 
      ] 

Возможно ли, что вместо

callback: function() { alert('"Yes" was clicked')} 

Я называю

delete.php?id=<?php echo $file['file_id'] 

Answer 1

Вы можете использовать функцию confirm('Message here'), которая возвращает true или false.

$(document).ready(function() { 
    $(".delete").bind("click", function (e) { 
     e.preventDefault(); 
     if (window.confirm('Are you sure?')) 
     { 
      // .. ajax call .. 
     } 
    }); 
}); 

EDIT:

У вас есть ошибка синтаксиса внутри вашего AJAX вызова.

$.ajax({ 
    url: 'delete.php', 
    data: { id: $this.data('id') }, 
    success: function(data){ 
     alert("File deleted"); 
    } 
}); 

Кроме того, нет $this.data('id'), так внутри HTML:

<a data-id="<?= $file['file_id'] ?>" class="delete"><img src="img/delete.png"/></a>