I'm trying to use jquery ( and/or VueJS with axios) to delete an asset from a frontend form (user is logged in and they have permissions to delete assets from this volume)
I have an HTML element that contains the fileID of the asset in question:
<div class="deleteAsset" :data-fileID="20031">Delete</div>
I have the following jQuery click action:
$('.deleteAsset').click(function() {
window.csrfTokenName = "{{ craft.app.config.general.csrfTokenName|e('js') }}";
window.csrfTokenValue = "{{ craft.app.request.csrfToken|e('js') }}";
var assetID = $(this).attr("data-fileID");
var data = {};
data[csrfTokenName] = csrfTokenValue;
data['assetId'] = assetID;
data['dataType'] = 'json';
data['action'] = '/actions/assets/delete-asset';
$.post('/', data, function(response, textStatus, jqXHR) {
console.log('clickResponse', response);
});
});
However I keep getting the following error in the console when I click the "Delete" button:
POST https://website.com/ 404 (Not Found)
I have tried having the action URL in the $.post() call, but it has the same effect. Anyone have any suggestions?