Prestashop:通过AJAX删除用户上传的文件，而不是重新加载页面

Prestashop: Delete user uploaded file via AJAX instead of reloading page

本文关键字：新加载 加载 删除 AJAX 通过 用户 文件 Prestashop      更新时间：2023-09-26

用户上传图像的默认显示方式，显示一个小的黑色X，看起来像这样(删除图像):

<a href="path/to/yourproduct?deletePicture=1" title="Delete" >

当用户点击该按钮时，页面"重新加载"，用户上传的文件被删除。

我不知道代码是在哪里删除的文件-所以我想也许AJAX将是一个更好的方式去做它。另外，万一用户在页面上输入了信息，他们就不必重新输入了。

我把黑色的小X改成了

<a id="deletePictureTrigger" href="javascript:void(0)" title="Delete" >

我还在product.js:

中添加了这个
$('#deletePictureTrigger').click(function(e){
    alert('now it deletes');
});

此操作生效并弹出警告。

让这一切继续下去的最好方式是什么?

会是这样吗?: 

$('#deletePictureTrigger').click(function(e){
    alert('now it deletes');
        $.ajax({
            url: "path/to/product?deleteProduct=1",
            type: 'GET',
            cache: false,
            dataType: 'json',
            processData: false,
            contentType: false,             
            //enable for saving on 'add to cart'
            //async: true,
            success: function(data, textStatus, jqXHR)
            {
                alert ("Deleted");
                $('.customizationUploadBrowse').remove();
            },
            error: function(jqXHR, textStatus, errorThrown)
            {
                alert ("there was an error:"+errorThrown);
            // ***** THIS GETS AN ERROR ***** //
            }
        });
});

当页面被请求时，deletePicture方法在哪里?

我想自动化这个，所以ajax删除它而不重新加载页面。

我必须像这样对ajax调用进行一些更改:

$('body').on('click', '#deletePictureTrigger', function(event){
    event.preventDefault();
     var data = new FormData();
     data.append('ajax', 1);
        $.ajax({
            url: window.location.href+"?deletePicture=1",
            type: 'GET',
            data: data,
            cache: false,
            //dataType: 'json',
            processData: false,
            contentType: false,             
            //enable for saving on 'add to cart'
            //async: true,
            success: function(data, textStatus, jqXHR)
            {
                $('#preview-img0').remove();
                $('#customImages').remove();
            },
            error: function(jqXHR, textStatus, errorThrown)
            {
                console.log( jqXHR);
                alert ("there was an error:"+errorThrown);
            }
        });
});
相关文章：