Class SfUploader

The uploader component is useful to upload images, documents, and other files to server. The component is the extended version of HTML5 that is uploaded with multiple file selection, auto upload, drag and drop, progress bar, preload files, and validation.

Inheritance

System.Object

Syncfusion.Blazor.SfBaseComponent

SfUploader

Namespace: Syncfusion.Blazor.Inputs

Assembly: Syncfusion.Blazor.dll

Syntax

public class SfUploader : SfBaseComponent

Constructors

SfUploader()

Declaration

public SfUploader()

Properties

AllowedExtensions

Specifies the extensions of the file types allowed in the Uploader component and pass the extensions with comma separators.

For example,if you want to upload specific image files, pass `AllowedExtensions` as ".jpg,.png".

Declaration

public string AllowedExtensions { get; set; }

Property Value

Type	Description
System.String

AllowMultiple

Declaration

public bool AllowMultiple { get; set; }

Property Value

Type	Description
System.Boolean

AsyncSettings

Configures the save and remove URL to perform the upload operations in the server asynchronously.

Declaration

public UploaderAsyncSettings AsyncSettings { get; set; }

Property Value

Type	Description
UploaderAsyncSettings

AutoUpload

By default, the Uploader component initiates automatic upload when the files are added in upload queue.

If you want to manipulate the files before uploading to server, disable the AutoUpload property.

The buttons "upload" and "clear" will be hided from file list when AutoUpload property is true.

Declaration

public bool AutoUpload { get; set; }

Property Value

Type	Description
System.Boolean

Buttons

You can customize the default text of "browse, clear, and upload" buttons with plain text or HTML elements. The buttons' text can be customized from localization also.

If you configured both Locale and Buttons property,the Uploader component considers the Buttons property value.

Declaration

public UploaderButtons Buttons { get; set; }

Property Value

Type	Description
UploaderButtons

CssClass

Specifies the CSS class name that can be appended with root element of the Uploader. One or more custom CSS classes can be added to a Uploader.

Declaration

public string CssClass { get; set; }

Property Value

Type	Description
System.String

DirectoryUpload

Specifies a boolean value that indicates whether the folder of files can be browsed in the Uploader component.

Declaration

public bool DirectoryUpload { get; set; }

Property Value

Type	Description
System.Boolean

DropArea

Specifies the drop target to handle the drag-and-drop upload. By default, the Uploader creates wrapper around file input that will act as drop target.

Declaration

public string DropArea { get; set; }

Property Value

Type	Description
System.String

DropEffect

Specifies the drag operation effect to the Uploader component.

Possible values are

• Copy
• Move
• Link
• None

Declaration

public DropEffect DropEffect { get; set; }

Property Value

Type	Description
DropEffect

Enabled

Specifies a boolean value that indicates whether the Uploader allows the user to interact with it.

Declaration

public bool Enabled { get; set; }

Property Value

Type	Description
System.Boolean

EnablePersistence

Enable or disable persisting Uploader state between page reloads. If enabled, the Files state will be persisted.

Declaration

public bool EnablePersistence { get; set; }

Property Value

Type	Description
System.Boolean

EnableRtl

Enable or disable rendering Uploader in right to left direction.

Declaration

public bool EnableRtl { get; set; }

Property Value

Type	Description
System.Boolean

Files

Specifies the list of files that will be preloaded on rendering of Uploader component. The property used to view and remove the uploaded files from server.

By default, the files are configured with uploaded successfully state. The following properties are mandatory to configure the preload files:

• Name
• Size
• Type

Declaration

public List<UploaderUploadedFiles> Files { get; set; }

Property Value

Type	Description
System.Collections.Generic.List<UploaderUploadedFiles>

HtmlAttributes

You can add the additional html attributes such as styles, class, and more to the root element.

If you configured both property and equivalent html attributes, then the component considers the property value.

Declaration

public Dictionary<string, object> HtmlAttributes { get; set; }

Property Value

Type	Description
System.Collections.Generic.Dictionary<System.String, System.Object>

ID

Specifies the id of the Uploader component.

Declaration

public string ID { get; set; }

Property Value

Type	Description
System.String

InputAttributes

You can add the additional input attributes such as disabled, value, and more to the root element. If you configured both property and equivalent input attribute, then the component considers the property value.

Declaration

public Dictionary<string, object> InputAttributes { get; set; }

Property Value

Type	Description
System.Collections.Generic.Dictionary<System.String, System.Object>

Locale

Specifies the global culture and localization of the Uploader component.

Declaration

public string Locale { get; set; }

Property Value

Type	Description
System.String

MaxFileSize

Specifies the maximum allowed file size to be uploaded in bytes. The property used to make sure that you cannot upload too large files.

Declaration

public double MaxFileSize { get; set; }

Property Value

Type	Description
System.Double

MinFileSize

Specifies the minimum file size to be uploaded in bytes. The property used to make sure that you cannot upload empty files and small files.

Declaration

public double MinFileSize { get; set; }

Property Value

Type	Description
System.Double

Multiple

Specifies a boolean value that indicates whether the multiple files can be browsed or dropped simultaneously in the Uploader component.

Declaration

public bool Multiple { get; set; }

Property Value

Type	Description
System.Boolean

SequentialUpload

By default, the file Uploader component is processing the multiple files simultaneously.

If SequentialUpload property is enabled, the file upload component performs the upload one after the other.

Declaration

public bool SequentialUpload { get; set; }

Property Value

Type	Description
System.Boolean

ShowFileList

Specifies a boolean value that indicates whether the default file list can be rendered. The property used to prevent default file list and design own template for file list.

Declaration

public bool ShowFileList { get; set; }

Property Value

Type	Description
System.Boolean

TabIndex

Specifies the tab order of the component.

Declaration

public int TabIndex { get; set; }

Property Value

Type	Description
System.Int32

Template

Specifies the HTML string that used to customize the content of each file in the list.

Declaration

public RenderFragment<FileInfo> Template { get; set; }

Property Value

Type	Description
Microsoft.AspNetCore.Components.RenderFragment<FileInfo>

Methods

BuildRenderTree(RenderTreeBuilder)

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder	__builder

BytesToSize(Double)

It is used to convert bytes value into kilobytes or megabytes depending on the size based on binary prefix.

Declaration

public Task<string> BytesToSize(double bytes)

Parameters

Type	Name	Description
System.Double	bytes

Returns

Type	Description
System.Threading.Tasks.Task<System.String>

Cancel(FileInfo[])

Stops the in-progress chunked upload based on the file data. When the file upload is canceled, the partially uploaded file is removed from server.

specifies the files data to cancel the progressing file.

Declaration

public Task Cancel(FileInfo[] fileData = null)

Parameters

Type	Name	Description
FileInfo[]	fileData

Returns

Type	Description
System.Threading.Tasks.Task

ClearAll()

Clear all the file entries from list that can be uploaded files or added in upload queue.

Declaration

public Task ClearAll()

Returns

Type	Description
System.Threading.Tasks.Task

GetFilesData(Nullable<Double>)

Get the data of files which are shown in file list.

specifies the file list item(li) index

Declaration

public Task<List<FileInfo>> GetFilesData(Nullable<double> index = null)

Parameters

Type	Name	Description
System.Nullable<System.Double>	index

Returns

Type	Description
System.Threading.Tasks.Task<System.Collections.Generic.List<FileInfo>>

OnInitializedAsync()

Declaration

protected override Task OnInitializedAsync()

Returns

Type	Description
System.Threading.Tasks.Task

Overrides

Syncfusion.Blazor.SfBaseComponent.OnInitializedAsync()

OnParametersSetAsync()

Declaration

protected override Task OnParametersSetAsync()

Returns

Type	Description
System.Threading.Tasks.Task

Pause(List<FileInfo>, Nullable<Boolean>)

Pauses the in-progress chunked upload based on the file data.

specifies the files data to pause from uploading. Set true if used custom UI.

Declaration

public Task Pause(List<FileInfo> fileData = null, Nullable<bool> custom = null)

Parameters

Type	Name	Description
System.Collections.Generic.List<FileInfo>	fileData
System.Nullable<System.Boolean>	custom

Returns

Type	Description
System.Threading.Tasks.Task

PropertyInitialized()

Declaration

protected void PropertyInitialized()

PropertyParametersSet()

Declaration

protected void PropertyParametersSet()

Remove(FileInfo[], Nullable<Boolean>, Nullable<Boolean>, Nullable<Boolean>, Object)

Remove the uploaded file from server manually by calling the remove URL action.

If you pass an empty argument to this method, the complete file list can be cleared, otherwise remove the specific file based on its argument ("file_data").

specifies the files data to remove from file list/server. Set true if the component rendering with customize template. Set true if files remove without removing event. Set false, to post file name only to the remove action.

Declaration

public Task Remove(FileInfo[] fileData = null, Nullable<bool> customTemplate = null, Nullable<bool> removeDirectly = null, Nullable<bool> postRawFile = null, object args = null)

Parameters

Type	Name	Description
FileInfo[]	fileData
System.Nullable<System.Boolean>	customTemplate
System.Nullable<System.Boolean>	removeDirectly
System.Nullable<System.Boolean>	postRawFile
System.Object	args

Returns

Type	Description
System.Threading.Tasks.Task

Resume(FileInfo[], Nullable<Boolean>)

Resumes the chunked upload that is previously paused based on the file data.

specifies the files data to resume the paused file.

Declaration

public Task Resume(FileInfo[] fileData = null, Nullable<bool> custom = null)

Parameters

Type	Name	Description
FileInfo[]	fileData
System.Nullable<System.Boolean>	custom

Returns

Type	Description
System.Threading.Tasks.Task

Retry(FileInfo[], Nullable<Boolean>, Nullable<Boolean>)

Retries the canceled or failed file upload based on the file data.

specifies the files data to retry the canceled or failed file Set true to retry from canceled stage and set false to retry from initial stage.

Declaration

public Task Retry(FileInfo[] fileData = null, Nullable<bool> fromcanceledStage = null, Nullable<bool> custom = null)

Parameters

Type	Name	Description
FileInfo[]	fileData
System.Nullable<System.Boolean>	fromcanceledStage
System.Nullable<System.Boolean>	custom

Returns

Type	Description
System.Threading.Tasks.Task

SortFileList(FileInfo[])

Allows you to sort the file data alphabetically based on its file name clearly.

specifies the files data for upload

Declaration

public Task<List<FileInfo>> SortFileList(FileInfo[] filesData = null)

Parameters

Type	Name	Description
FileInfo[]	filesData

Returns

Type	Description
System.Threading.Tasks.Task<System.Collections.Generic.List<FileInfo>>

Upload(FileInfo[], Nullable<Boolean>)

Allows you to call the upload process manually by calling save URL action.

To process the selected files (added in upload queue), pass an empty argument otherwise upload the specific file based on its argument.

specifies the files data for upload.

Declaration

public Task Upload(FileInfo[] files = null, Nullable<bool> custom = null)

Parameters

Type	Name	Description
FileInfo[]	files
System.Nullable<System.Boolean>	custom

Returns

Type	Description
System.Threading.Tasks.Task