Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
44 lines (40 sloc) 2.17 KB
@page "/example-upload"
<h1 style="display:inline">Upload</h1><a style="margin-left: 10px" href="https://github.com/akorchev/blazor.radzen.com/blob/master/Pages/UploadPage.razor" target="_blank">[source code]</a><a style="margin-left: 10px" href="https://www.radzen.com/documentation/blazor/upload/" target="_blank">[documentation]</a>
<p>This page demonstrates <b>Upload</b> component. Check also <a href="https://github.com/akorchev/blazor.radzen.com/blob/master/Controllers/UploadController.cs" target="_blank">UploadController source code</a> for more info.</p>
<RadzenCard>
<div class="row">
<div class="col-md-6">
<h3>Single file upload</h3>
<RadzenUpload Url="upload/single" Style="margin-bottom: 20px;"
Progress="@((args) => OnProgress(args, "Single file upload"))" />
<br />
<h3>Multiple files upload</h3>
<RadzenUpload Multiple="true" Url="upload/multiple" Style="margin-bottom: 20px;"
Progress="@((args) => OnProgress(args, "Multiple files upload"))" />
<br />
<h3>Upload images only</h3>
<RadzenUpload Multiple="true" Accept="image/*" Url="upload/multiple" Style="margin-bottom: 20px;"
Progress="@((args) => OnProgress(args, "Images only upload"))" />
<br />
<h3>Upload with additional parameter</h3>
<RadzenUpload Multiple="true" Accept="image/*" Url=@($"upload/{1}") Style="margin-bottom: 20px;"
Progress="@((args) => OnProgress(args, "Upload with additional parameter"))" />
<br />
</div>
<div class="col-md-6">
<h3>Events</h3>
<RadzenCard style="overflow: auto;height:500px;">
<RadzenProgressBar Value="@progress" Unit="@info" Visible="@(progress > 0)" Style="margin-bottom: 20px" />
</RadzenCard>
</div>
</div>
</RadzenCard>
@code {
int progress;
string info;
void OnProgress(UploadProgressArgs args, string name)
{
this.info = $"% '{name}' / {args.Loaded} of {args.Total} bytes.";
this.progress = args.Progress;
}
}
You can’t perform that action at this time.