Hi Artur,
We can replace the browse button with icons
using Created
event, JSInterop, and CSS. Please refer to the below code snippet and
documentation for more details.
[Index.razor]
|
@page "/"
@using Syncfusion.Blazor.Inputs
@inject IJSRuntime JSRuntime
<SfUploader>
<UploaderEvents Created="@CreatedHandler"></UploaderEvents>
</SfUploader>
@code {
private async Task
CreatedHandler()
{
await JSRuntime.InvokeAsync<object>("Icons");
}
}
<style>
.e-icons
{
color:black;
}
.e-upload
.e-file-select-wrap .e-btn
{
border: none;
background-color: transparent;
box-shadow: none;
}
</style>
|
[_Layout.cshtml]
|
<script>
function
Icons()
{
document.getElementsByClassName('e-css
e-btn e-upload-browse-btn')[0].innerHTML = "<i class='e-icons
e-upload-1'></i>";
document.getElementsByClassName('e-file-drop')[0].innerHTML = 'YOU CAN REPLACE THE
SENTANCE';
}
</script>
|
Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorUploadIICON2147000389
Regards,
Udhaya Kumar D
If this post is helpful, please consider
Accepting it as the solution so that other members can locate it more quickly.
