1+ <Grid TItem =" User"
2+ AllowFiltering =" true"
3+ AllowPaging =" true"
4+ AllowSorting =" true"
5+ Class =" table table-hover"
6+ DataProvider =" UsersDataProvider"
7+ FiltersRowCssClass =" bg-dark text-white bg-opacity-25 border-bottom-0"
8+ FiltersTranslationProvider =" GridFiltersTranslationProvider"
9+ HeaderRowCssClass =" bg-dark text-white border-bottom-0"
10+ PageSize =" 10"
11+ PageSizeSelectorVisible =" true"
12+ PageSizeSelectorItems =" @(new int[] { 5,10,20 })"
13+ PaginationItemsTextFormat =" {0} - {1} van {2} artikelen"
14+ ItemsPerPageText =" Artikelen per pagina"
15+ Responsive =" true"
16+
17+ <GridColumns >
18+ <GridColumn TItem =" User" HeaderText =" Id" PropertyName =" Id"
19+ @context.Id
20+ </GridColumn >
21+ <GridColumn TItem =" User" HeaderText =" User Name" PropertyName =" Name"
22+ @context.Name
23+ </GridColumn >
24+ <GridColumn TItem =" User" HeaderText =" DOB" PropertyName =" DOB"
25+ @context.DOB
26+ </GridColumn >
27+ <GridColumn TItem =" User" HeaderText =" Status" PropertyName =" Status" FilterTextboxWidth =" 170"
28+ @context.Status
29+ </GridColumn >
30+ </GridColumns >
31+
32+ </Grid >
33+
34+ @code {
35+ private IEnumerable <User > users = default ! ;
36+
37+ private async Task <IEnumerable <FilterOperatorInfo >> GridFiltersTranslationProvider ()
38+ {
39+ var filtersTranslation = new List <FilterOperatorInfo >();
40+
41+ // number/date/boolean
42+ filtersTranslation .Add (new (" =" " gelijk aan" FilterOperator .Equals ));
43+ filtersTranslation .Add (new (" !=" " Niet gelijk" FilterOperator .NotEquals ));
44+ // number/date
45+ filtersTranslation .Add (new (" <" " Minder dan" FilterOperator .LessThan ));
46+ filtersTranslation .Add (new (" <=" " Kleiner dan of gelijk aan" FilterOperator .LessThanOrEquals ));
47+ filtersTranslation .Add (new (" >" " Groter dan" FilterOperator .GreaterThan ));
48+ filtersTranslation .Add (new (" >=" " Groter dan of gelijk aan" FilterOperator .GreaterThanOrEquals ));
49+ // string
50+ filtersTranslation .Add (new (" *a*" " Bevat" FilterOperator .Contains ));
51+ filtersTranslation .Add (new (" a**" " Begint met" FilterOperator .StartsWith ));
52+ filtersTranslation .Add (new (" **a" " Eindigt met" FilterOperator .EndsWith ));
53+ filtersTranslation .Add (new (" =" " gelijk aan" FilterOperator .Equals ));
54+ // common
55+ filtersTranslation .Add (new (" x" " Duidelijk" FilterOperator .Clear ));
56+
57+ return await Task .FromResult (filtersTranslation );
58+ }
59+
60+
61+ private async Task <GridDataProviderResult <User >> UsersDataProvider (GridDataProviderRequest < User > request )
62+ {
63+ if (users is null ) // pull employees only one time for client-side filtering, sorting, and paging
64+ users = GetUsers (); // call a service or an API to pull the employees
65+
66+ return await Task .FromResult (request .ApplyTo (users ));
67+ }
68+
69+ private IEnumerable <User > GetUsers ()
70+ {
71+ return new List <User >
72+ {
73+ new User { Id = 107 , Name = " Alice" DOB = new DateOnly (1998 , 11 , 17 ), Status = UserStatus .Registered },
74+ new User { Id = null , Name = " Bob" DOB = new DateOnly (1985 , 1 , 5 ), Status = UserStatus .Verified },
75+ new User { Id = 106 , Name = " John" DOB = new DateOnly (1995 , 4 , 17 ), Status = UserStatus .Registered },
76+ new User { Id = 104 , Name = " Pop" DOB = new DateOnly (1985 , 6 , 8 ), Status = UserStatus .Registered },
77+ new User { Id = 105 , Name = " Ronald" DOB = new DateOnly (1991 , 8 , 23 ), Status = UserStatus .VerificationPending },
78+ new User { Id = 102 , Name = " Line" DOB = new DateOnly (1977 , 1 , 12 ), Status = UserStatus .VerificationPending },
79+ new User { Id = 101 , Name = " Daniel" DOB = new DateOnly (1977 , 1 , 12 ), Status = UserStatus .Registered },
80+ new User { Id = 108 , Name = " Zayne" DOB = new DateOnly (1991 , 1 , 1 ), Status = UserStatus .Verified },
81+ new User { Id = 109 , Name = " Isha" DOB = null , Status = UserStatus .Verified },
82+ new User { Id = 110 , Name = " Vijay" DOB = new DateOnly (1990 , 7 , 1 ), Status = UserStatus .Verified },
83+ };
84+ }
85+
86+ public record class User
87+ {
88+ public int ? Id { get ; set ; }
89+ public string ? Name { get ; set ; }
90+ public DateOnly ? DOB { get ; set ; }
91+ public UserStatus Status { get ; set ; }
92+ }
93+
94+ public enum UserStatus
95+ {
96+ Registered ,
97+ VerificationPending ,
98+ Verified
99+ }
100+ }
0 commit comments