Question

echo '<td><a class="delete" href="#" id="'.$row['Id'].'">Delete</a></td>';



<script type="text/javascript">
         $(function() {
         $(".delete").click(function(){
         var element = $(this);
         var del_id = element.attr("id");;
         var info = 'id=' + del_id;
         if(confirm("Are you sure you want to delete this?"))
         {
          $.ajax({
            type: "POST",
            url: "ajax_delete.php",
            data: info,
            success: function(){
          }
         });
           $(this).parents("#checkboxlist").animate({ backgroundColor: "#003" }, "slow")
           .animate({ opacity: "hide" }, "slow");
          }
         return false;
         });
         });

      </script>

ajax_delete.php

<?php
session_start();
include "config.php";

$id=$_REQUEST['id'];

    $record = mysql_query("delete from contact_form where Id = '$id'",$con);
    if($record)
    {

        echo '<META HTTP-EQUIV="Refresh" Content="0; URL=list.php">';
         $_SESSION['deleted']="yes";

    }

    else
    {
        echo mysql_error();
    }


?>

我还添加了jquery库。尝试了所有可能的事情。但桌子没有刷新。数据已删除。但只有当我刷新页面时才会反映出来。我很沮丧。

Answer 1

您需要将其从页面中删除，然后才能成功删除。

success: function(){
    element.remove();
}

Answer 2

试试这个？

<script type="text/javascript">
         $(function() {
         $(".delete").click(function(){
         var element = $(this);
         var del_id = element.attr("id");;

         if(confirm("Are you sure you want to delete this?"))
         {
          $.ajax({
            type: "POST",
            url: "ajax_delete.php",
            data: {id:del_id},
            success: function(){
                element.parents("#checkboxlist").animate({ backgroundColor: "#003" }, "slow")
               .animate({ opacity: "hide" }, "slow");
              }
         });
          }
         });

         });

      </script>

Answer 3

首先将animation code放入success callback

更新了脚本

<script type="text/javascript">
    $(function () {
        $(".delete").click(function () {
            var element = $(this);
            var del_id = element.attr("id");
            ;
            var info = 'id=' + del_id;
            if (confirm("Are you sure you want to delete this?"))
            {
                $.ajax({
                    type: "POST",
                    url: "ajax_delete.php",
                    data: info,
                    success: function () {
                        element.parents("#checkboxlist").animate({backgroundColor: "#003"}, "slow")
                        .animate({opacity: "hide"}, "slow").remove(); //use element and after hide parent remove it 
                    }
                });

            }
            return false;
        });
    });

</script>

Answer 4

您可以使用JS从表中删除该行（ajax调用不会自动为您执行此操作！）。这样做：

$.ajax({
        type: "POST",
        url: "ajax_delete.php",
        data: info,
        success: function(){
          element.closest('tr').remove(); //remove the parent row of the delete button
      }
});

Answer 5

尝试将$(this).parents添加到ajax成功参数

success: function(){
        element.closest("#checkboxlist").animate({ backgroundColor: "#003" }, "slow")
               .animate({ opacity: "hide" }, "slow");         
     }

删除PHP mysql行时Ajax不工作

5 个答案: