AJAX调用运行MySQL删除查询正常但不隐藏从页面删除的表行

时间:2013-06-26 20:12:59

标签: jquery mysql ajax fadeout

我有一个运行AJAX调用的脚本,用于从数据表中删除指定的行。查询运行正常,记录从数据库中删除,但是当用户单击删除按钮隐藏时,我无法获取用户正在浏览的表中的行。我想我记得jQuerytd/tr存在问题,这也许是它,但即使在尝试将每个表行放在自己的div中以引用之后我仍然没有运气。< / p>

ajax请求:

$(document).ready(function() {
    //##### Send delete Ajax request to response.php #########
    //$("body").on("click", "#responds .del_button", function(e) {
        $("body").on("click", ".del_button", function(e) {
         e.returnValue = false;
         var clickedID = this.id.split('-'); //Split string (Split works as PHP explode)
         var DbNumberID = clickedID[1]; //and get number from array
         var myData = 'recordToDelete='+ DbNumberID; //build a post data structure

            jQuery.ajax({
            type: "POST", // HTTP method POST or GET
            url: "ajax/education_response.php", //Where to make Ajax calls
            dataType:"text", // Data type, HTML, json etc.
            data:myData, //Form variables
            success:function(response){
                //on success, hide  element user wants to delete.
                $('#item_'+DbNumberID).fadeOut("slow");
            },
            error:function (xhr, ajaxOptions, thrownError){
                //On error, we alert user
                alert(thrownError);
            }
            });
    });
    $('html, body').stop();

});

我正在玩的结构填充表格(我知道每行divs都很混乱,但正如我所说,我确信我记得jQuery不喜欢tr/td。我在其他页面上使用了此ajax调用,fadeout()在所有其他情况下都正常工作,因此我必须确保它是因为我正在尝试从前端表中删除单个行。

<?php
while ($row = mysqli_fetch_assoc($result)) {
    $catid = $row['id'];
    $catsector = $row['job_sector'];
    $cattype = $row['job_type'];
    $catname = $row['job_name'];
    echo "<div id=item_".$catid.">";
    echo "<tr class=''>";
    echo "<td>$catsector</td>";
    echo "<td>$cattype</td>";
    echo "<td>$catname</td>";
    echo "<td><a href='#' class='del_button' id='del-". $catid ."'>Delete CV</a></td>";
    echo "</tr>";           
    echo "</div>";
}
?>

2 个答案:

答案 0 :(得分:1)

删除

echo "<div id=item_".$catid.">";

echo "</div>";

并更改

echo "<tr class=''>";

echo "<tr class='' id=item_".$catid.">";

答案 1 :(得分:0)

更改

var myData = 'recordToDelete='+ DbNumberID; //build a post data structure

        jQuery.ajax({
        type: "POST", // HTTP method POST or GET
        url: "ajax/education_response.php", //Where to make Ajax calls
        dataType:"text", // Data type, HTML, json etc.
        data:myData, //Form variables
        success:function(response){
            //on success, hide  element user wants to delete.
            $('#item_'+DbNumberID).fadeOut("slow");
        },
        error:function (xhr, ajaxOptions, thrownError){
            //On error, we alert user
            alert(thrownError);
        }
     });

  var that = this;
  var myData = 'recordToDelete='+ DbNumberID; //build a post data structure

        jQuery.ajax({
        type: "POST", // HTTP method POST or GET
        url: "ajax/education_response.php", //Where to make Ajax calls
        dataType:"text", // Data type, HTML, json etc.
        data:myData, //Form variables
        success:function(response){
            //on success, hide  element user wants to delete.
                 $(that).closest('tr').fadeOut("slow"); // will works faster 
        },
        error:function (xhr, ajaxOptions, thrownError){
            //On error, we alert user
            alert(thrownError);
        }
  });

根据Aguardientico的回答,对标记进行更改也很有用。