ajax成功重载div内容无效

There are many questions on this but no answer seems to be easy working.

关于这个问题有很多问题，但是没有答案似乎很容易。

I have a <form>with delete icons on every row. Now .on('click',functoin()..I have an ajax request like this:

我有一个

$.ajax({
    type:"POST",
    url:"/update_rows.php",
    data:"delete_id="+$(this).attr("row"),
    success:function(data) {
        if(data) {
            //window.location.reload(true);
            //alert(data);
            $(".refresh-after-ajax").load("/cms/modules/mod11/inc/modinclude_admin.php .refresh-after-ajax");
        } else {
            //window.location.reload(true);
        }

    }
});

This works and update_rows.php looks like this:

这工作和update_rows。php是这样的:

<?php
    require_once($_SERVER["DOCUMENT_ROOT"].'/cms/inc/config.inc.php');
    global $navid,$DB_PRE,$lang_cms;
    $db=new DB();
    $sql='Delete FROM '.$DB_PRE.'_mod_ref_pricing  WHERE id='.intval($_POST['delete_id']);
    $db->query($sql);
?>

Now I don't want to use window.location.reload(true);cause I just want to update that container where a row has been deleted. As you cann see I tried with .load()to only reload that <div/>but no chance. alert(data) is empty because I'm not returning anything from update_rows.phpbut what should I return there to refresh the <div/>?

现在我不想使用window.location.reload(true);因为我只想更新已删除一行的容器。正如您所看到的，我尝试了。load()来重新加载

，但没有机会。alert(data)为空，因为我没有从update_rows中返回任何内容。phpbut我应该返回到哪里刷新 ?

Thanks for advices!

谢谢你的建议!

7 个解决方案

#1

OOOHHHHHH I've written the .load()at the wrong place now it works:

我在错误的地方写了。load()现在它可以工作了:

$.ajax({
    type:"POST",
    url:"/update_rows.php",
    data:"delete_id="+$(this).attr("row"),
    success:function(data) {
        if(data) {

        } else {
            $(".refresh-after-ajax").load(window.location + " .refresh-after-ajax");
        }

    }
});

Thanks for the help, the $(this).remove() would also have been a nice solution

感谢您的帮助，$(this).remove()也是一个不错的解决方案

#2

you have 2 options to update the container 
1) on successfully deletion remove the deleted element using jquery .remove() method 
or
2) update(innerHtml)) for whole container by return the data same as same format use on page load.

#3

You can return the id from your PHP code, which is your delete_id in Js. By referencing that you can use :

可以从PHP代码中返回id，这是Js中的delete_id。通过引用，您可以使用:

$("#your_delete_id").remove();

$(" # your_delete_id ").remove();

#4

$(this).remove();

after the ajax load line.

在ajax加载线之后。

#5

Use both .remove() and .html() depending on if you wish to remove the row or replace its contents.

使用.remove()和.html()，这取决于您是否希望删除该行或替换该行的内容。

Note that your php should check for a fail on the db delete/update and return specific data for this which you can then check for:

请注意，您的php应该检查db删除/更新失败，并为此返回特定数据，然后您可以检查:

$(".click-icon").on('click', function() {
  $.ajax({
      type:"POST",
      url:"/update_rows.php",
      data:"delete_id="+$(this).attr("row"),
      success:function(data) {
          if(data=="failed") {
             //show error
          } else if(data=="delete") {
             $(this).closest('tr').remove(); // remove row
          } else if(data) {
             $(this).closest('tr').html('<td>'+data+'</td>'); // replace row with new cell         
          }
      }
  });
});

#6

jquery.fn.remove()works fine. but more complicated works, use javascript load table function.

jquery.fn.remove()没问题。但更复杂的工作是使用javascript加载表函数。

#7

In update_rows.php you just wrote the query but did nothing.

在update_rows。php您只是编写了查询，但什么也没做。

$run=$db->query($sql); if($run){ echo success; }else{ echo failed; }

$ = $ db运行- >查询($ sql);如果(美元){回声成功;其他} {回声失败;}

Then in your javascript ajax function use the id to delete the row from div. If you alert(data) you should see success or failed.

然后在javascript ajax函数中使用id从div中删除行。

var delete_id=$(this).attr("row");
$.ajax({
type:"POST",
url:"/update_rows.php",
data:delete_id,
success:function(data) {
    if(data=='success') {
        //window.location.reload(true);
        //alert(data);
        $("#"+delete_id).remove();
    } else {
        //window.location.reload(true);
    }

}
});

#1