使用ajax删除一些数据后,我想刷新我的div。我正在使用Laravel 5.4。我是laravel的初学者。请帮帮我。
这是我刷新div的代码:
var url = window.location.href;
function RefreshDiv() {
$(".uploaded-images").fadeOut();
$(".uploaded-images").load(url+" .uploaded-images", function() {
$(".uploaded-images").fadeIn();
});
}
当我执行RefreshDiv
函数时,它只会使我的div空,但当我按f5
刷新我的页面时,它成功删除了我的数据。我唯一的问题是我的RefreshDiv
,我不想刷新我的div,但它给了我空的div。
这是我执行得很好的删除功能:
function deleteImage(product_img_id) {
$.ajax({
url: "{{ url('admin/del-img') }}/" +product_img_id,
type: "GET",
dataType: "JSON",
success: function(data) {
RefreshDiv();
}
});
}
这是我要刷新的div:
<div class="row" style="margin-top: 20px;">
<h5>Uploaded Images</h5>
<div class="uploaded-images">
</div>
</div>
在我上传的图像div中,是来自我的其他ajax的委托函数。
这是我的委托功能:
function getProductDetails(product_id) {
$( ".uploaded-images" ).empty();
$.ajax({
url: "{{ url('admin/get-product') }}/" +product_id,
type: "GET",
dataType: "JSON",
success: function(data) {
for(var i=1;i<data.product_images.length;i++) {
$(".uploaded-images").append('<div class="img-wrap">'+'<span class="close">×</span>'+'<img src="'+"{{ asset('image_files') }}/"+data.product_images[i].product_image+'" data-id="'+data.product_images[i].product_img_id+'" style="max-height:50px; max-width:90px;">'+'</div>');
};
}
});
}
答案 0 :(得分:1)
为什么要刷新div ...如果要移除图像,为什么不从DOM中删除成功元素?
试试这个:
function RefreshDiv(product_img_id) {
$("img[data-id="+product_img_id+"]").closest('.img-wrap').remove();
}
答案 1 :(得分:-1)
试试这个:
function deleteImage(product_img_id) {
$.ajax({
url: "{{ url('admin/del-img') }}/" +product_img_id,
type: "GET",
dataType: "JSON",
success: function(data) {
RefreshDiv(product_img_id);
}
});
}
var url = window.location.href;
function RefreshDiv(product_img_id) {
$(".uploaded-images img[data-id="+product_img_id+"]").parent().remove();
$(".uploaded-images").load(url+" .uploaded-images", function() {
$(".uploaded-images").fadeIn();
});
}