BlazorInputFileExtended 1.2.11

There is a newer version of this package available.
See the version list below for details.
dotnet add package BlazorInputFileExtended --version 1.2.11                
NuGet\Install-Package BlazorInputFileExtended -Version 1.2.11                
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="BlazorInputFileExtended" Version="1.2.11" />                
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add BlazorInputFileExtended --version 1.2.11                
#r "nuget: BlazorInputFileExtended, 1.2.11"                
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install BlazorInputFileExtended as a Cake Addin
#addin nuget:?package=BlazorInputFileExtended&version=1.2.11

// Install BlazorInputFileExtended as a Cake Tool
#tool nuget:?package=BlazorInputFileExtended&version=1.2.11                

Nuget Nuget

Description

Extend the traditional component InputFile with more options like drag and drop and upload methods directly. Less codding for all.

Properties

Upload management

  • MultiFile: Indicates can accept multiple files on the selection box.
  • MaxUploatedFiles: Indicates how many files can be selected. Default 5.
  • MaxFileSize: Indicates maximum file size per each file selected. Default 512000 bytes.
  • CleanOnSuccessUpload: Indicates clean all loaded files after upload to the server. Default false.
  • SelectionText: Set the text when files are chosen. Default chosen.
  • SelectionCss: Set the CSS to format the text when files are chosen. Default info.

Input formating

  • InputContent: HTML for the choose file input.
  • InputCss: Set the CSS to format the input file tag.
  • InputTitle: Set the title when the user hover the input file tag.
  • InputFileTypes: Indicates what kind of files can be selected. Ex: images/*.

Button formating

  • ButtonContent: HTML inside the button for upload.
  • ButtonShow: Button to upload can be hide if you want to manage externally. Default true.
  • ButtonCss: Set the CSS to format the button.
  • ButtonTitle: Set the title when the user hover the button.

Preview setup only for images

  • IsImage: Indicate the files to select is images. Default true.
  • ShowPreview: Indicates if need to show a preview for the file selected. Default true.
  • PreviewWrapperCss: Set the CSS to format the wrapper for the figure tag content the image. Default image
  • FileCss: Set the CSS to format the image tag.
  • FileBytes: Store the byte[] about the last image selected.

Methods

  • FormSave: Required component reference, and can use with EditForm event OnValidSubmit. This action send the form.
    • If TargetDataObject is set, this have preference when send the form.
    • If TargetDataObject is not set, then send the Context with the form data.

Drag and Drop

  • CanDropFiles: Enable drag and drop.
  • DropZoneCss: CSS to use for format the drop zone.
  • DroppingCss: CSS to use when user are dropping the file.

Methods Drag and Drop

  • LoadDropScriptsAsync: If the component load with CanDropfiles = false, with this method can change and enable dropping files.
  • UnLoadDropScriptsAsync: If the component is already setup for dropping files with this method can disabled.

Post actions

If you want to upload files with some other data, send the model data.

  • TargetFormDataContent: MultipartFormDataContent with the form data to send with the files.
  • TargetDataObject: Object with the data model to send with the files. This will encapsulated into a MultipartFormDataContent before send to server.
  • TargetFormFieldName: Indicates the field form name to send the files. Default files
  • TargetToPostFile: Indicate the URL to use for the post action. If it's not setup return a event error if try to upload images.

Events

  • OnUploadedFile: When each file is uploaded. Returns FileUploadEventArgs.
  • OnUploadComleted: When all files is uploaded. Returns FilesUploadEventArgs.
  • OnError: When some exception. Returns ArgumentException.
  • OnSave: When click on SAVE button. Returns HttpMessageResponse.
  • OnChange: Notmal InputFile OnChange. Returns InputFileChangeEventArgs.

Handler

You can use the class BlazorInputFileExtenden.InputFileHandler to implement your own logic or the logic for the Authorization send files.

Product Compatible and additional computed target framework versions.
.NET net5.0 is compatible.  net5.0-windows was computed.  net6.0 was computed.  net6.0-android was computed.  net6.0-ios was computed.  net6.0-maccatalyst was computed.  net6.0-macos was computed.  net6.0-tvos was computed.  net6.0-windows was computed.  net7.0 was computed.  net7.0-android was computed.  net7.0-ios was computed.  net7.0-maccatalyst was computed.  net7.0-macos was computed.  net7.0-tvos was computed.  net7.0-windows was computed.  net8.0 was computed.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
2.4.22 1,905 8/6/2023
2.4.21 163 8/6/2023 2.4.21 is deprecated because it has critical bugs.
2.4.20 171 7/30/2023
2.4.19 1,268 4/3/2023
2.4.18 5,907 8/17/2022
1.3.17 7,671 9/9/2021
1.3.16 314 9/6/2021
1.2.15 351 9/4/2021
1.2.14 310 8/21/2021
1.2.13 303 8/13/2021
1.2.12 346 8/5/2021
1.2.11 351 8/1/2021
1.2.10 305 7/19/2021
1.2.9 336 7/19/2021
1.2.8 372 7/19/2021 1.2.8 is deprecated.
1.2.7 403 7/19/2021 1.2.7 is deprecated.
1.2.6 357 7/17/2021
1.1.4 606 7/11/2021
1.0.3 344 7/8/2021
1.0.2 375 7/6/2021
1.0.1 388 7/4/2021

Version 1.2.11
Add cascading parameter EditContext to manage form validation when click on upload button
Expose method FormSave for can be call from the event OnValidSubmit, this required a component reference
Version 1.2.10
Solved issue about base url when is published in a folder not in a root
Add OnChange Event is want to use as a normal InputFile