Question

我们如何确认ajax调用中删除的数组元素结果？

我有一个数组：

$.ajax({  
           url: "recursive.php",
           method:"POST",
           dataType: "json",       
           success: function(data)  
               {
                  $('#treeview').treeview({
                      data: data
                  });
               }   
      });

在我的recursive.php中，我有以下代码：

$arr = array(
        'text' => '<img src="img/pdf.png"><a href="delete.php?doc='.$sub_data["code"].' "target="_blank">'.$sub_data["n_doc"].'</a>
       '
       );

在此<a href中，我需要确认后才能删除。在delete.php中，我有：

$sql = mysqli_query($conn, ' DELETE FROM saisie WHERE code = "'.$doc.'" ') or die (mysqli_error());

Answer 1

在成功函数中再次调用ajax：

   $(document).ready(function(){
       $.ajax({  
           url: "recursive.php",
           method:"POST",
           dataType: "json",       
           success: function(data)  
               { 
                   $(document).on('click', '.btn_supp', function(){
                       if(confirm("do you want to delete this file?")){
                         $.ajax({  
                          url: "delete.php",
                          method:"POST",
                           dataType: "json",       
                         success: function(data)  
                         {
                         alert("deleted");
                         });
                        }   
                        });
                       }
                   });   
                  $('#treeview').treeview({
                      data: data,
                      selectedBackColor: 'rgb(211,211,211)',
                      selectedColor: '#4A4A49',
                      enableLinks:true,
                      collapsedall: true
                  });
               }   
      });`

Answer 2

当AJAX添加到DOM时，完成显示确认的最简单方法是将委托的事件侦听器绑定到视图的DOMReady函数中。

由于jQuery在DOMReady状态期间绑定了事件处理程序，因此它将不会绑定ajax.success函数中的其他元素，除非响应中包含javascript并且dataType是'script'或您从成功函数中解析data变量，然后手动添加一个事件。

这假定具有id="treeview"的元素已经存在。

<script type="text/javascript">
jQuery(function($) {
    $(document).on('click', 'a[href^="delete.php"]', function(e) {
        return window.confirm('Are you sure you want to delete this file?');
    });

    $.ajax({
        url: "recursive.php",
        method:"POST",
        dataType: "json",       
        success: function(data) {
            $('#treeview').treeview({
                data: data,
                selectedBackColor: 'rgb(211,211,211)',
                selectedColor: '#4A4A49',
                enableLinks:true,
                collapsedall: true
            });
        }
    });
});
</script>
<div id="treeview"></div>

这是通过告诉jQuery监视#treeview元素内的所有点击来寻找<a href="delete.php">的触发元素而起作用的。具体来说，href^="delete.php"表示一个<a>元素，其中一个href以delete.php开头。如果找到一个，则执行回调函数并显示确认对话框。

如果将class属性添加到recursive.php锚元素，则可以将a[href^="delete.php"]替换为a.classname。

示例https://jsfiddle.net/ub1hw9tn/

$arr = array(
    'text' => '<img src="img/pdf.png"><a class="delete" href="delete.php?doc='.$sub_data["code"].'" target="_blank">'.$sub_data["n_doc"].'</a>'
);

然后在您的JavaScript中

$(document).on('click', 'a.delete', function(e) {
    if (!window.confirm('Are you sure you want to delete this file?')) {
       e.preventDefault();
    }
});

确认使用ajax删除

2 个答案:

示例https://jsfiddle.net/ub1hw9tn/