You can customize the uploader control using confirm dialog before removing the files. Here, ej2 dialog is used as confirm dialog. Refer to the following example.
<div class="control_wrapper">
@Html.EJS().Uploader("UploadFiles").Removing("onremove").AsyncSettings(new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "https://ej2.syncfusion.com/services/api/uploadbox/Save", RemoveUrl = "https://ej2.syncfusion.com/services/api/uploadbox/Remove" }).Render()
@Html.EJS().Dialog("dialog").Target("body").Visible(false).Width("250px").Content("Confirm to remove the file?").Buttons(ViewBag.confirmbutton).Render()
</div>
<script>
var removeFile = [], dialog;
window.onload = function () {
dialog = document.getElementById("dialog").ej2_instances[0];
}
function onremove(args) {
emoveFile = [];
args.cancel = true;
removeFile.push(args.filesData);
dialog.show();
}
function onClick(args) {
var uploadObj = document.getElementById("UploadFiles").ej2_instances[0];
dialog.hide();
uploadObj.remove(removeFile[0], false, true);
}
function Close() {
dialog.hide();
}
</script>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
namespace EJ2CoreSampleBrowser.Controllers.TextBoxes
{
public partial class UploaderController : Controller
{
public ActionResult DefaultFunctionalities()
{
List<DialogDialogButton> button = new List<DialogDialogButton>() { };
button.Add(new DialogDialogButton() { Click = "confirmBtnClick", ButtonModel = new confirmButtonModel() { content = "Cancel", isPrimary = true } });
button.Add(new DialogDialogButton() { Click = "confirmBtnClick", ButtonModel = new confirmButtonModel() { content = "OK"} });
ViewBag.confirmbutton = button;
return View();
}
}
public class confirmButtonModel
{
public string content { get; set; }
public bool isPrimary { get; set; }
}
}
.control_wrapper {
max-width: 400px;
margin: 0 auto;
}