I'm using a rich text editor where the user can paste images, and delete, as you can see:
I use the event ActionComplete to save and delete data from Azure blob storage, with the code bellow:
function actionComplete(args) {
if (args.requestType == "Image") {
imgelement = args.elements[0];
toAzure(imgelement.src, function (dataUrl) {
imgelement.setAttribute('src', dataUrl)
})
}
if (args.requestType == "Remove") {
var fileUrl = args.event.itemCollection.selectNode[0].src;
var nameContainerIndex = "ticketattachment/";
var indexFile = args.event.itemCollection.selectNode[0].src.indexOf(nameContainerIndex);
var indexEnd = args.event.itemCollection.selectNode[0].src.indexOf("?");
var fileName = fileUrl.substr(indexFile + nameContainerIndex.length, indexEnd - indexFile - nameContainerIndex.length);
deleteBlobIfExists("ticketattachment", fileName);
}
}
function toAzure(url, callback) {
var httpRequest = new XMLHttpRequest();
httpRequest.onload = function () {
if (this.status == 200) {
var fileName = $("#Ticket_Id").val() + "/" + "image" + Math.floor(Math.random() * 1000) + ".png";
createBlockBlobFromBrowserFile(new File([this.response], fileName), callback);
}
};
httpRequest.open('GET', url);
httpRequest.responseType = 'blob';
httpRequest.send();
}
The events are working properly in most of situations, but when it has text and a image bellow, just like:
If i delete the image without clicking on the image the event ActionComplete doesn't trigger, like selecting the text and deleting it all, the event just doesn't trigger.
I tried to use Change event, but this doesn't trigger too.
My editor:
@Html.EJS().RichTextEditorFor(model => model.Ticket.Description).ActionComplete("actionComplete").Change("actionComplete").Blur("validateButtonSubmit").Change("validateButtonSubmit").QuickT oolbarSettings(e => { e.Image((object)ViewBag.image); }).ToolbarSettings(e => e.Items((object)ViewBag.tools)).Locale("root").Render()
