HxInputFile #

Wraps HxInputFileCore as a Bootstrap form control (including Label etc.)

Limit file size and/or accepted types #

<HxInputFile Label="Image" Accept="image/*,.custom" MaxFileSize="500000" />

Simple single file upload #

OriginalFileName:
ContentType:
Size: bytes
LastModified:
ResponseStatus:
ResponseText:

Complex demo #

FileIndex Filename Progress ContentType Size LastModified ResponseStatus ResponseText

Completed: bytes in files

API #

Parameters #

Name Type Description
Accept string Takes as its value a comma-separated list of one or more file types, or unique file type specifiers, describing which file types to allow. MDN Web Docs - HTML attribute: accept.
CssClass string Custom CSS class to render with the wrapping div.
Enabled bool? When null (default), the Enabled value is received from cascading FormState. When value is false, input is rendered as disabled. To set multiple controls as disabled use HxFormState.
Hint string Hint to render after input as form-text.
HintTemplate RenderFragment Hint to render after input as form-text.
InputCssClass string Custom CSS class to render with the input element.
InputSize InputSize? Size of the input.
Label string Label to render before input (or after input for Checkbox).
LabelCssClass string Custom CSS class to render with the label.
LabelTemplate RenderFragment Label to render before input (or after input for Checkbox).
MaxFileSize long? The maximum file size in bytes. When exceeded, the OnFileUploaded returns 413-RequestEntityTooLarge as FileUploadedEventArgs.ResponseStatus. The default is null (unlimited).
MaxParallelUploads int? Maximum number of concurrent uploads. The default is 6 (from HxInputFileCore).
Multiple bool Single false or multiple true files upload.
Settings InputFileSettings Set of settings to be applied to the component instance (overrides Defaults, overridden by individual parameters).
UploadUrl string URL of the server endpoint receiving the files.

Other properties #

Name Type Description
FileCount int Last known count of associated files.

Event callbacks #

Name Type Description
OnChange EventCallback<InputFileChangeEventArgs> Gets or sets the event callback that will be invoked when the collection of selected files changes.
OnFileUploaded EventCallback<FileUploadedEventArgs> Raised after a file is uploaded (for every single file separately).
OnProgress EventCallback<UploadProgressEventArgs> Raised during running file upload (the frequency depends on browser implementation).
OnUploadCompleted EventCallback<UploadCompletedEventArgs> Raised when all files are uploaded (after all OnFileUploaded events).

Methods #

Method Returns Description
GetFilesAsync() Task<FileInfo<>> Gets list of files chosen.
ResetAsync() Task Clears associated input-file element and resets component to initial state.
StartUploadAsync(string accessToken) Task Starts the upload.
UploadAsync(string accessToken) Task<UploadCompletedEventArgs> Uploads the file(s).

Static properties #

Property Type Description
Defaults InputFileSettings Application-wide defaults for the HxInputFile and derived components.

HxInputFileCore #

Raw component extending InputFile with direct upload.

API #

Parameters #

Name Type Description
Accept string Takes as its value a comma-separated list of one or more file types, or unique file type specifiers, describing which file types to allow. MDN Web Docs - HTML attribute: accept.
AdditionalAttributes IDictionary<string, object> A collection of additional attributes that will be applied to the created element.
Enabled bool Make the item appear disabled by setting to false. The default is true.
Id string The input element id.
MaxFileSize long? The maximum file size in bytes. When exceeded, the OnFileUploaded returns 413-RequestEntityTooLarge as FileUploadedEventArgs.ResponseStatus. The default is long.MaxValue (unlimited).
MaxParallelUploads int? The maximum number of concurrent uploads. The default is 6.
Multiple bool Single false or multiple true files upload.
Settings InputFileCoreSettings Set of settings to be applied to the component instance (overrides Defaults, overridden by individual parameters).
UploadUrl string URL of the server endpoint receiving the files.

Other properties #

Name Type Description
Element ElementReference?
FileCount int The last known count of associated files.

Event callbacks #

Name Type Description
OnChange EventCallback<InputFileChangeEventArgs>
OnFileUploaded EventCallback<FileUploadedEventArgs> Raised after a file is uploaded (for every single file separately).
OnProgress EventCallback<UploadProgressEventArgs> Raised during running file upload (the frequency depends on browser implementation).
OnUploadCompleted EventCallback<UploadCompletedEventArgs> Raised when all files are uploaded (after all OnFileUploaded events).

Methods #

Method Returns Description
GetFilesAsync() Task<FileInfo<>> Gets list of files chosen.
ResetAsync() Task Clears associated input element and resets component to initial state.
StartUploadAsync(string accessToken) Task Initiates the upload (does not wait for upload completion). Use OnUploadCompleted event.
UploadAsync(string accessToken) Task<UploadCompletedEventArgs> Uploads the file(s).

Static properties #

Property Type Description
Defaults InputFileCoreSettings Application-wide defaults for the HxInputFileCore.
An unhandled error has occurred. Reload 🗙