This is a migrated thread and some comments may be shown as answers.

Custom Template for TelerikCheckBoxListFilter

1 Answer 487 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Adrian
Top achievements
Rank 1
Iron
Veteran
Iron
Adrian asked on 07 Apr 2021, 11:02 AM

I have a Telerik Blazor Grid and one of the columns is displaying values from an enum, the enum is defined as:

01.[Serializable]
02.public enum ClientType
03.{
04.    [EnumOrder(1)]
05.    [Description("Fleet")]
06.    Fleet = 1,
07. 
08.    [EnumOrder(2)]
09.    [Description("Manufacturer")]
10.    Manufacturer = 2,
11. 
12.    [EnumOrder(3)]
13.    [Description("Manufacturer (Restricted)")]
14.    ManufacturerRestricted = 3,
15. 
16.    [EnumOrder(4)]
17.    [Description("Other")]
18.    Other = 4
19.}

 

I wanted to be able to display the value stored in the Description attribute of the enum rather than the enum value as the Description attribute value is more readable.  I was able to do this by using an enum extension method and calling that in a GridColumn template like so:

1.<GridColumn Field="@(nameof(ClientInfo.ClientType))" Width="100px" Filterable="true" Groupable="false">
2.    <Template>
3.        @((context as ClientInfo)?.ClientType.ToDescription())
4.    </Template>
5.</GridColumn>

 

I then looked at adding a checkbox filter to this column so that all the possible enum values would be shown as checkboxes.  I have managed to do this by adding a FilterMenuTemplate with a TelerikCheckBoxListFilter to the GridColumn like so:

01.<GridColumn Field="@(nameof(ClientInfo.ClientType))" Width="100px" Filterable="true" Groupable="false">
02.    <FilterMenuTemplate Context="context">
03.        <TelerikCheckBoxListFilter Data="@GridFilterOptionsService.ClientTypeList"
04.                                   Field="@(nameof(ClientTypeFilterOption.ClientType))"
05.                                   @bind-FilterDescriptor="@context.FilterDescriptor">
06.        </TelerikCheckBoxListFilter>
07.    </FilterMenuTemplate>
08.    <Template>
09.        @((context as ClientInfo)?.ClientType.ToDescription())
10.    </Template>
11.</GridColumn>

 

This functions and correctly filters the grid based on the filter values checked.  Unfortunately I'm not able to apply the same enum extension method as to display the Description attribute value from the enum for the checkboxlist items Text item.

The attached picture shows the checkboxlist rendering the enum values and not the Description attribute values.

I have tried the following but it doesn't work:

01.<GridColumn Field="@(nameof(ClientInfo.ClientType))" Width="100px" Filterable="true" Groupable="false">
02.    <FilterMenuTemplate Context="context">
03.        <TelerikCheckBoxListFilter Data="@GridFilterOptionsService.ClientTypeList"
04.                                   Field="@(nameof(ClientTypeFilterOption.ClientType))"
05.                                   @bind-FilterDescriptor="@context.FilterDescriptor">
06.            <Template>
07.                @((context as ClientTypeFilterOption)?.ClientType.ToDescription())
08.            </Template>
09.        </TelerikCheckBoxListFilter>
10.    </FilterMenuTemplate>
11.    <Template>
12.        @((context as ClientInfo)?.ClientType.ToDescription())
13.    </Template>
14.</GridColumn>

 

Is there a way I can achieve displaying the enum Description attribute values in the TelerikCheckBoxListFilter like I can in the GridColumn Template ?

 

 

 

1 Answer, 1 is accepted

Sort by
0
Nadezhda Tacheva
Telerik team
answered on 09 Apr 2021, 05:51 PM

Hi Adrian,

You can also use the DisplayName attribute of the enum to set the desired display names for its values.

We currently have an opened bug report in our public feedback portal - Enum DisplayName attributes are ignored. Once it is fixed, you can use that for your scenario instead of setting the text that you want to display in the Description parameter of the enum. If you define it in the DisplayName attribute, it will be automatically read by the component and displayed accordingly.

I added a vote your behalf to increase the bug report priority. You can also subscribe to receive email notifications when its status changes ( this is the best way to know when a certain bug is fixed as we announce such information in the portal ).

In the meantime, an approach you might consider is trying a custom filter menu - you can find more details and examples of such implementation in this article as well as in this live demo. It will give you more flexibility to work with the content you want to display in the filter menu.

If any further questions appear, please do not hesitate to contact us.

Thank you for choosing Telerik UI for Blazor!

Regards,
Nadezhda Tacheva
Progress Telerik

Тhe web is about to get a bit better! 

The Progress Hack-For-Good Challenge has started. Learn how to enter and make the web a worthier place: https://progress-worthyweb.devpost.com.

Tags
Grid
Asked by
Adrian
Top achievements
Rank 1
Iron
Veteran
Iron
Answers by
Nadezhda Tacheva
Telerik team
Share this question
or