BlazorInputFileExtended 1.2.7

.NET 5.0 This package targets .NET 5.0. The package is compatible with this framework or higher.
Additional Details

When test the bug is not yet fixed.

There is a newer version of this package available.
See the version list below for details. 
dotnet add package BlazorInputFileExtended --version 1.2.7                

                    
                

            
NuGet\Install-Package BlazorInputFileExtended -Version 1.2.7
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.7" />
For projects that support PackageReference, copy this XML node into the project file to reference the package. 
paket add BlazorInputFileExtended --version 1.2.7                

                    
                

            
#r "nuget: BlazorInputFileExtended, 1.2.7"
#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.7

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

Last Stable Version 1.2.7

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.

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.

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,885 8/17/2022
1.3.17 7,665 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.7
Fixed a bug to load the draganddrop.js when publish in a folder not in a root
Version 1.2.6
Enable Drag And Drop Files
Add property bool CanDropFiles
Add property string DropZoneCss
Add property string DroppingCss
Add JAVASCIPT file DragAdnDrop.js load dynacally when CanDropFiles is true. No need be referenced only add the component.
Add method LoadDropScriptsAsync for can enable dinamically drag and drop
Add method UnLoadDropScriptsAsync for dissabled dinamically drag and drop
Version 1.1.5
Set public the helper class FormData for can be used from a derivate class.
Fixed InputFileType. If is not string empty always setup like *. Only need setup if it's string empty and IsImage to setup like image/* to get all the images.
When clean change message from the event set total files and total size cleaned.
Fixed always send to the TarjetToPost when have some data to send if have or nor files