[英]Delete record without a page refresh with ajax in php
I am working on a Cakephp 2.x but I don't think the problem has anything to do with the Cakephp. 我正在开发Cakephp 2.x,但我认为问题与Cakephp没有任何关系。 I want to delete a file without a page refresh. 我想删除文件而不刷新页面。
HTML / PHP : HTML / PHP:
<div class = "success" style="display:none;">Deleted successfully </div>
<div class = "error" style="display:none;">Error </div>
<a href="javascript:void(0)" class="button icon-trash" title = "delete" onclick="openConfirm('<?php echo $filename; ?>','<?php echo $idImage; ?>');"></a>
JavaScript : JavaScript:
function openConfirm(filename, idImage) {
$.modal.confirm('Are you sure you want to delete the file?', function () {
deleteFile(filename, idImage);
}, function () {
});
};
function deleteFile(filename, idImage) {
var filename = filename;
$.ajax({
type: "POST",
data: {
idImage: idImage
},
url: "http://localhost/bugshot/deleteFile/" + filename,
success: function (data) {
if (data == 1) {
$(".success").fadeIn(500).delay(2000).fadeOut(500);
} else {
$(".error").fadeIn(500).delay(2000).fadeOut(500);
}
},
error: function () {
alert("error");
}
});
}
my images which is in foreach loop this code is displaying the image 我的图像在foreach循环中,此代码显示图像
foreach($file as $files):?> foreach($ file as $ files):?>
<?php $downloadUrl = array('controller' => 'bugshot', 'action' => 'downloadImages', $files['Image']['filename'], '?' => array('download' => true));
$imageUrl = array('controller' => 'bugshot', 'action' => 'downloadImages', $files['Image']['filename']);
?>
<?php echo $this->Html->link(
$this->Html->image($imageUrl),
$downloadUrl,
array('class' => 'frame', 'escape' => false)
);?>
Delete link 删除连结
<a href="javascript:void(0)" class="button icon-trash" title = "deleteImage" onclick="openConfirm('<?php echo $files['Image']['filename']; ?>','<?php echo $files['Image']['idImage'];; ?>');"></a>
The code works great except that after the image or record is deleted the record/image is still displayed on the page until it is refreshed. 该代码非常有用,除了删除图像或记录后,记录/图像仍显示在页面上,直到刷新为止。 How do I fix this? 我该如何解决?
You need to remove it with javascript. 您需要使用javascript将其删除。
$.ajax({
...
success: function (data) {
if (data == 1) {
$(".success").fadeIn(500).delay(2000).fadeOut(500);
$('img[src="/pathToImg/' + filename + '"]').remove(); // Remove by src
// $('#' + idImage).remove(); // Remove by ID.
} else {
$(".error").fadeIn(500).delay(2000).fadeOut(500);
}
}
...
});
Note : var filename = filename;
注意: var filename = filename;
means nothing because you are assigning filename argument to a new variable with the same name. 没有任何意义,因为您正在将文件名参数分配给具有相同名称的新变量。 You can just remove it. 您可以删除它。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.