BzUploader
Uploader
Five different looks
ButtonsFormsInput groupButton groupsDatePickerAutoCompleteCardsDisplayLoadingDialogsNotificationsOperation messageDrawerContext menuPaginationLightboxTreeDataGridChartsTabs & AccordionNavigationSidebarTimelineWizardCarouselUploaderEditorCalendarIranian tools
No component found.
Dropzone
The default look: a drag-and-drop area. OnFilesChanged hands you the file list.
File count: 0
@using BzCore.Components.Uploader
@using BzCore.Enums
<BzUploader Variant="BzUploaderVariant.Dropzone"
Multiple
MaxSizeMB="10"
OnFilesChanged="@(f => _count = f.Count)" />
<p>تعداد فایل: @_count</p>
@code {
private int _count;
}The five variants
All five share one snippet; only Variant changes.
Compact
Button
Avatar
Gallery
| Variant | Use for |
|---|---|
Dropzone | A large drag-and-drop area (default) |
Compact | The same dropzone in a tight space |
Button | Just a button, for inside forms |
Avatar | A profile picture, single file |
Gallery | Several images with previews |
@using BzCore.Components.Uploader
@using BzCore.Enums
@* Only Variant changes between these. *@
<BzUploader Variant="BzUploaderVariant.Compact" Title="بارگذاری" Hint="کلیک یا کشیدن" />
<BzUploader Variant="BzUploaderVariant.Button" ButtonText="انتخاب فایل ها" />
<BzUploader Variant="BzUploaderVariant.Avatar" Multiple="false" Accept="image/*" />
<BzUploader Variant="BzUploaderVariant.Gallery" Accept="image/*" />Limits and reading files
Constrain the input with MaxSizeMB, MaxFiles and Accept, then save the files on the server.
| Parameter | Default | Description |
|---|---|---|
Multiple | true | Allow several files |
MaxSizeMB | 10 | Max size per file |
MaxFiles | 20 | Max number of files |
Accept | — | Allowed extensions or MIME types |
OnFilesChanged | — | IReadOnlyList<BzUploadFile> |
@using BzCore.Components.Uploader
@using BzCore.Enums
<BzUploader Variant="BzUploaderVariant.Dropzone"
Multiple
MaxSizeMB="2"
MaxFiles="3"
Accept=".pdf,.docx"
Title="فقط PDF و Word"
Hint="حداکثر 3 فایل، هرکدام تا 2 مگابایت"
OnFilesChanged="OnFiles" />
@if (_names.Count > 0)
{
<p>@string.Join(" | ", _names)</p>
}
@code {
private List<string> _names = new();
private async Task OnFiles(IReadOnlyList<BzUploadFile> files)
{
_names = files.Select(f => f.Name).ToList();
// Saving to disk — always re-check the limit on the server too.
foreach (var f in files)
{
var path = Path.Combine("uploads", f.Name);
await using var target = File.Create(path);
// f.File is the underlying IBrowserFile.
await using var source = f.File.OpenReadStream(2 * 1024 * 1024);
await source.CopyToAsync(target);
}
}
}
@*
BzUploadFile members:
string Name file name
long Size size in bytes
string ContentType MIME type
bool IsImage true when ContentType starts with image/
string? PreviewUrl preview for image variants
IBrowserFile File the raw Blazor file, for reading the stream
*@