Search results

Customize Button with HTML Element in ASP.NET Core Uploader control

14 Apr 2021 / 1 minute to read

The uploader control allows you to customize the action buttons by using buttons  property. Refer to the following example.

tagHelper
buttons.cs
Copied to clipboard
<div class="control_wrapper">
    @Html.EJS().Uploader("UploadFiles").AutoUpload(false).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()
</div>
<script>
    var uploadEle = ej.base.createElement('span', { className: 'upload e-icons' });
    uploadEle.innerHTML = 'Upload All';
    var clearEle = ej.base.createElement('span', { className: 'remove e-icons' });
    clearEle.innerHTML = 'Clear All';
    window.onload = function (args) {
        var uploaderObj = document.getElementById("UploadFiles").ej2_instances[0];
        uploaderObj.setProperties({
            buttons: {
                browse: 'Choose file',
                clear: clearEle,
                upload: uploadEle
            }
        })
    }
</script>
Copied to clipboard
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()
        {
            return View();
        }
    }
}

Output be like the below.

uploader