Skip to content

Commit 4bd595a

Browse files
kendo-botKB Botxristianstefanov
authored
Added new kb article grid-customize-enum-text (#2857)
* Added new kb article grid-customize-enum-text * kb(Grid): apply suggestions as per comments --------- Co-authored-by: KB Bot <kb-bot@telerik.com> Co-authored-by: Hristian Stefanov <Hristian.Stefanov@progress.com>
1 parent 614d319 commit 4bd595a

File tree

1 file changed

+85
-0
lines changed

1 file changed

+85
-0
lines changed
+85
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
---
2+
title: How to Customize Enum Text Display
3+
description: Learn how to customize the display of enum values by removing underscores and applying custom text.
4+
type: how-to
5+
page_title: How to Customize Enum Text Displays in Blazor Grid
6+
slug: grid-kb-customize-enum-text
7+
tags: grid, enum, display, customize
8+
res_type: kb
9+
ticketid: 1680753
10+
---
11+
12+
## Environment
13+
14+
<table>
15+
<tbody>
16+
<tr>
17+
<td>Product</td>
18+
<td>Grid for Blazor</td>
19+
</tr>
20+
</tbody>
21+
</table>
22+
23+
## Description
24+
25+
In scenarios where enums are used for filtering and enum values contain underscores, it might be necessary to display these values without underscores or with customized text. This knowledge base article answers the following questions:
26+
27+
- How to remove underscores from enum values?
28+
- How to display customized text for enum values?
29+
30+
## Solution
31+
32+
Use the `Display` attribute on your enum members to specify custom display names for enum values, which will be shown in the filter dropdown instead of the default enum names.
33+
34+
`````RAZOR
35+
@using System.ComponentModel.DataAnnotations;
36+
37+
<TelerikGrid Data=@GridData
38+
FilterMode="@GridFilterMode.FilterRow"
39+
Pageable="true"
40+
Height="400px">
41+
<GridColumns>
42+
<GridColumn Field=@nameof(Employee.Name) />
43+
<GridColumn Field=@nameof(Employee.AgeInYears) Title="Age" />
44+
<GridColumn Field=@nameof(Employee.EmploymentStatus) Title="Employment Status" />
45+
</GridColumns>
46+
</TelerikGrid>
47+
48+
@code {
49+
private List<Employee> GridData { get; set; }
50+
51+
protected override void OnInitialized()
52+
{
53+
GridData = new List<Employee>();
54+
var rand = new Random();
55+
for (int i = 0; i < 100; i++)
56+
{
57+
GridData.Add(new Employee()
58+
{
59+
EmployeeId = i,
60+
Name = "Employee " + i.ToString(),
61+
AgeInYears = rand.Next(10, 80),
62+
EmploymentStatus = i % 3 == 0 ? EmploymentStatus.Full_Time : (i % 3 == 1 ? EmploymentStatus.Part_Time : EmploymentStatus.Contractor)
63+
});
64+
}
65+
}
66+
67+
public class Employee
68+
{
69+
public int? EmployeeId { get; set; }
70+
public string Name { get; set; }
71+
public int? AgeInYears { get; set; }
72+
public EmploymentStatus EmploymentStatus { get; set; }
73+
}
74+
75+
public enum EmploymentStatus
76+
{
77+
[Display(Name = "Full Time")]
78+
Full_Time,
79+
[Display(Name = "Part Time")]
80+
Part_Time,
81+
Contractor
82+
}
83+
}
84+
`````
85+

0 commit comments

Comments
 (0)