1+ @page " /"
2+
3+ @using System .IO
4+ @using Microsoft .AspNetCore .Hosting
5+ @using System .Threading
6+ @using Telerik .Blazor .Components .FileSelect
7+
8+ @inject IWebHostEnvironment HostingEnvironment
9+
10+
11+ NOTE: This snippet shows one example how to associate file from a FileSelect.
12+ It does not implement full editing (e.g., you would typically implement this in an editor template
13+ and add the necessary CRUD operations and services, and add UI to show the file list in "view" mode).
14+ For brevity, this just shows the approach of using
15+ a lambda expression to provide the necessary metadata to the code that will save the file.
16+
17+ <TelerikGrid Data =" @MyData" Height =" 700px"
18+ Pageable =" true" PageSize =" 5" Sortable =" true" Groupable =" true"
19+ FilterMode =" @GridFilterMode.FilterRow"
20+ Resizable =" true" Reorderable =" true"
21+ <GridColumns >
22+ <GridColumn Field =" @(nameof(Employee.Id))" Width =" 120px"
23+ <GridColumn Field =" @(nameof(Employee.Name))" Title =" Employee Name" Groupable =" false"
24+ <GridColumn Title =" Associated Files (max 1MB / file)"
25+ <Template >
26+ @{
27+ Employee empl = context as Employee ;
28+ // pass the current grid row in a lambda expression to the select handler to use when saving the files
29+ TelerikFileSelect OnSelect =" @( (FileSelectEventArgs e) => SaveFilesWithMetadata(e, empl) )"
30+ MaxFileSize =" @(1024 * 1024)"
31+ }
32+ </Template >
33+ </GridColumn >
34+ <GridColumn Field =" @(nameof(Employee.Team))" Title =" Team"
35+ </GridColumns >
36+ </TelerikGrid >
37+
38+ @code {
39+ public IEnumerable <Employee > MyData = Enumerable .Range (1 , 30 ).Select (x => new Employee
40+ {
41+ Id = x ,
42+ Name = " name " + x ,
43+ Team = " team " + x % 5
44+ });
45+
46+ public Dictionary <string , CancellationTokenSource > Tokens { get ; set ; } = new Dictionary <string , CancellationTokenSource >();
47+
48+ private async Task SaveFilesWithMetadata (FileSelectEventArgs args , Employee empl )
49+ {
50+ int i = 0 ;
51+ foreach (var file in args .Files )
52+ {
53+ if (! file .InvalidExtension )
54+ {
55+ // we will use the ID of the grid record to alter the way the file is saved
56+ // implement the required businss logic instead
57+ // in this example, we make a folder for each employee by ID, put files by index there and add a GUID for uniqueness
58+ string folder = HostingEnvironment ? .WebRootPath + Path .DirectorySeparatorChar + empl .Id ;
59+ string fileName = i .ToString () + " _" + Guid .NewGuid () + " _" + file .Name ;
60+ await SaveFileToDisk (file , folder , fileName );
61+ i ++ ;
62+ // additionally, you may want to update the model to "know" about those files associated with it
63+ // for example, by adding a file name to its list. This is not done here for brevity
64+ // as how and what needs to be stored depends on the business logic
65+ // so this example won't persist the files information
66+
67+ }
68+ }
69+
70+ // this only saves the file to disk. Implement the business logic as needed and tweak this as needed for your case.
71+ private async Task SaveFileToDisk (FileSelectFileInfo file , string folder , string fileName )
72+ {
73+ Tokens .Add (file .Id , new CancellationTokenSource ());
74+ if (! Directory .Exists (folder ))
75+ {
76+ Directory .CreateDirectory (folder );
77+ }
78+ var path = Path .Combine (folder , fileName );
79+ await using FileStream fs = new FileStream (path , FileMode .Create );
80+ await file .Stream .CopyToAsync (fs , Tokens [file .Id ].Token );
81+ }
82+
83+
84+ public class Employee
85+ {
86+ public int Id { get ; set ; }
87+ public string Name { get ; set ; }
88+ public List <string > Files { get ; set ; }
89+ public string Team { get ; set ; }
90+ public DateTime HireDate { get ; set ; }
91+ }
92+ }
0 commit comments