I would like to have my users click my own button or element to trigger the file select dialog that you get from clicking the "Select Files..." button on the Upload component.

A workaround is to use a function like this

window.customUploadClick = function () {
    $('.k-upload-button input').trigger('click');
}

---

ADMIN EDIT

Completed with 3.0.0 release

If you are not using jQuery already, you don't have to add it for this, standard browser API can do this too:

@inject IJSRuntime _js

<script suppress-error="BL9992">
    window.customUploadClick = function () {
        document.querySelector(".k-upload-button input").click();
    }
</script>

<TelerikButton OnClick="@InvokeSelectClick">invoke click</TelerikButton>

<TelerikUpload></TelerikUpload>

@code{
    async Task InvokeSelectClick()
    {
        await _js.InvokeVoidAsync("customUploadClick");
    }
}

---

Is it possible to programmatically perform actions on the uploader, such as to remove files, rather than having to click on the remove button on each uploaded file?

---

ADMIN EDIT

The request also applies to the FileSelect component.

Might be related to the ability to have initial files shown in the list: https://feedback.telerik.com/blazor/1485660-initial-files-in-blazor-upload.

At the moment, you could try using JS Interop to loop over the list, determine which file you want to remove and .click() its remove button. Here is a basic example of getting the buttons to click the second one. You could traverse the DOM to get the file name, or you could keep a collection of the files to use indexes in a fashion similar to this example.

@inject IJSRuntime _js

@* move this script to a correct location it's here as ahack to make the snippet shorter and easy to copy  *@
<script suppress-error="BL9992">
    function removeSecondFile(){
        var deleteButtons = document.querySelectorAll("li.k-file button");
        if(deleteButtons && deleteButtons.length > 1){
            deleteButtons[1].click();
        }
    }
</script>

<TelerikUpload AutoUpload="false" SaveUrl="my-endpoint"></TelerikUpload>
<TelerikButton OnClick="@RemoveSecondFile">Remove second file</TelerikButton>

@code{
    async Task RemoveSecondFile()
    {
        await _js.InvokeVoidAsync("removeSecondFile");
    }
}

---

In version 2.9.0 of the library there are two small spelling issues:

Scheduler_Recurrence_Editor_Frequencies_Monthly: Montly //Montly is written without "h"
Upload_InvalidMinFileSize: File size too small //Missing dot after the message (E.g. Upload_InvalidMaxFileSize has an ending dot).

Best regards,

Christian