javascript ajax成功重新加载div内容不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21403402/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ajax success reload div content not working
提问by caramba
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:
我<form>在每一行都有一个带删除图标。现在.on('click',functoin()..我有一个这样的ajax请求：
$.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.phplooks 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()只重新加载它，<div/>但没有机会。alert(data)是空的，因为我没有返回任何东西，update_rows.php但是我应该返回什么来刷新<div/>？
Thanks for advices!
感谢您的建议！
采纳答案by caramba
OOOHHHHHH I've written the .load()at the wrong place now it works:
OOOHHHHHH 我.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() 也是一个不错的解决方案
回答by S..
$(this).remove();
after the ajax load line.
在ajax加载线之后。
回答by Tims
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 应该检查数据库删除/更新是否失败并为此返回特定数据，然后您可以检查：
$(".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
}
}
});
});
回答by NLSaini
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.
回答by Makrand
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();
回答by soredive
jquery.fn.remove()works fine. but more complicated works, use javascript load table function.
jquery.fn.remove() 工作正常。但更复杂的工作，使用javascript加载表功能。
回答by Praveen Govind
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; }
$run=$db->query($sql); if($run){ 回声成功；}else{ 回声失败；}
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 中删除行。如果你 alert(data) 你应该看到成功或失败。
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);
}
}
});
