Declined
Last Updated: 27 Mar 2025 11:54 by ADMIN
Jared
Created on: 13 Mar 2025 17:45
Category: UI for Blazor
Type: Bug Report
0
Clear button in Grid FilterMenu not properly clearing custom filter
I am trying to make a custom component to put in the Grid's FilterMenuTemplate that stacks the default contents from FilterMenuType.Menu above the default contents of FilterMenuType.CheckBoxList since there isn't a 'both' option in Blazor like there was in the Silverlight library. I am using the TelerikFilter as a placeholder for now to try and get basic logic working, but if there is a simple solution to directly insert the default menu without my component having to generate the list of allowed filter operators for it's own dropdowns, that would also be appreciated. My goal is to make my component look like the two menu types stacked.

While working on how to connect the filters together, I noticed that the clear button can gets the later part of the CompositeFilterDescriptor stuck in the grid.

Reproducible example:  https://blazorrepl.telerik.com/wzuRPRvB00Vlj1Ac28

With the current configuration of the repl, filtering using only the TelerikCheckBoxListFilter and clicking filter will filter the column as expected, and clicking clear will blank out the checklist but won't reset the grid's filtering from those checkboxes until after ticking a checkbox and clicking filter, then unticking all checkboxes and clicking filter again. If the checkbox gets used then the clear button gets clicked, clicking the filter button after using the TelerikFilter without any checkboxes checked will filter based on the checkboxes the grid remembers ANDed with the new values from the TelerikFilter, again until the checkbox gets used and then manually emptied without using the clear button.

If the order of _textFilterValueInternal and _checkFilterValueInternal in the FilterDescriptors list get reversed, then the grid's filter memory issue gets transferred to the TelerikFilter meaning the issue is presumably with the grid itself. Also, if you use one or more values in both filters, then the clear button works as intended if there weren't already filters stuck inside the grid.

The clear button works as expected if filtering with both the filter and the checklist before clearing the filter.

Example images:

Start:

Check some boxes:


Filtered:


Open filter menu and click "Clear":


Re-open the filter menu:


New filter:


Click "Filter":


Re-open filter menu:


Click "Clear" button again:
3 comments
ADMIN
Nadezhda Tacheva
Posted on: 27 Mar 2025 11:54

Hello Jared,

Please see my comments on the relevant points as follows:

1. Filter seems to work until you click the Clear button.

Indeed, the filtering does seem to work. This is because you are using a template for the filter menu and the DataSourse package that handles the data operations handles various structures for the FilterDescriptors.

The built-in Grid filtering (and clearing the filters), however, expects a specific structure for the FilterDescriptors in its state - see the screenshot from my last post (the default structure section on the left).

2. Clear button does not seem to work as it is supposed to work.

The Grid features a complex logic for handling the filtering. If one provides a configuration of FilterDescriptors that the component is not designed to work with, this may result in breaking the filtering logic or even clearing the filters.

In other words, the Clear button logic will search for a specific structure for the FilterDescriptors that the Grid is designed to work with and it will fail if it cannot find it.

3. Example's behavior don't match between your version and my version.

The behavior depends on the exact configuration. You can still use your current setup if you prefer but you will need to make some adjustments - see section 5. Further steps.

4. Existing Telerik reference material.

There may be differences between the various Telerik products as not all products commit to complete feature compatibility.

UI for Blazor does not provide a built-in option to include both the menu and the CheckBoxList in the filter popup. However, you are able to achieve any desired design using a custom approach and the available templates.

5. Further steps

I understand you want to keep the current structure of the filter menu and the nested filters. In order for that to work, though, some adjustments are needed.

Here are my suggestions to enhance your current setup:

  • The default Clear button cannot work with these nested filters, so you must handle the clearing with a custom approach. For that purpose, add a Filter Menu Buttons Template to override the default buttons. Add your custom button for clearing and upon its click, loop through the FilterDescriptors in the Grid state to clear them. Note that this has to be performed manually - the ClearFilterAsync method will not work due to the same reason as the Clear button is not working.
  • The Filter component may introduce unnecessary complex UI. You may consider using inputs and dropdowns to simulate the default filter menu. The following article may be useful if you decide to proceed with this approach: Use Filter Operator Drop-Down in Filter Template.

===

I hope the above information provides enough clarity on the matter and will help you move forward with the configuration on your end.

Regards,
Nadezhda Tacheva
Progress Telerik

Enjoyed our products? Share your experience on G2 and receive a $25 Amazon gift card for a limited time!

Jared
Posted on: 20 Mar 2025 16:25

Hi Nadezhda,

Thanks for your feedback and follow-up. I still have a few comments for which I'd really appreciate a corresponding explanation. If you need further explanation or screenshots on any of these items please let me know. Thanks in advance.

1. Filter seems to work until you click the Clear button.

I think the reason the filtering works in my example is because the context's filter is already using a CompositeFilterDescriptor, so adding more layers of CompositeFilterDescriptor, like how the TelerikFilter element works when using groups, would already have to be supported at the grid level. By the time all the column contexts get combined for filtering the grid, the grid likely doesn't care how many layers of CompositeFilterDescriptor there are.

2. Clear button does not seem to work as it is supposed to work.

As with many other tools, I would have expected the "Clear" button to just overwrite the context's filter descriptors back to the default state, regardless of the current value in the context, which does not seem to work. Especially considering what is mentioned in 1, a reset button should not care about the current state of the values it is clearing.

3. Example's behavior don't match between your version and my version.

From your earlier feedback "...also noticed that when you open the Filter menu with filters already applied, the corresponding checkboxes are not checked."

This is not the case for the example I shared with you. I think it works that way in your version of the example because you didn't remove the parsing logic when you changed what variable is assigned to the TelerikCheckBoxListFilter. Also, directly passing the context to the TelerikCheckBoxListFilter doesn't help me to solve my original problem of trying to rebuild a mixed filter menu that has the checklist AND the default textual filter options on the same column.

4. Existing Telerik reference material.
The SilverLight documentation where you could set the filter menu as 'text fields', 'checklist' or 'both' got removed, but the 'both' option I am trying to create looked something like the below examples from other Telerik libraries which makes me think that this version of Telerik should at least let me recreated the behavior that I need. Please see documentation below.
(https://docs.telerik.com/devtools/wpf/controls/radgridview/filtering/basic)


(https://docs.telerik.com/devtools/winui/controls/raddatagrid/filtering/datagrid-overview)

ADMIN
Nadezhda Tacheva
Posted on: 20 Mar 2025 13:49

Hi Jared,

Thank you for providing detailed information for the scenario and example runnable code!

By design, the "Clear" button in the filter menu clears the filter descriptors from the Grid's state. The fact that it is not clearing the filters properly tells me that there is some issue with the filter descriptors in the state.

I observed the state changes when filtering to see how the filters are applied with your current configuration. I noticed there is a discrepancy between the structure that the Grid expects its filter descriptors in and the structure of the custom filter descriptors:

I cannot confirm why the filtering works with your current configuration but the structure of the filter descriptors in the Grid state is not correct and I believe this is why the Grid cannot clear them upon "Clear" button click.

If you update the MixedFilterMenu component so that the CheckBoxListFilter in it works with the CompositeFilterDescriptor filter that comes from the context, then the correct structure of FIlterDescriptors is created and filtering and clearing work properly.

Here is the updated sample: https://blazorrepl.telerik.com/czaHcYFR394XhHZT46.

Having the above in mind, it looks like there no such bug in the Grid, so I updated the status of the item.

===

Side note:

I also noticed that when you open the Filter menu with filters already applied, the corresponding checkboxes are not checked. Here you may find how you can propely configure the CheckBoxListFilter: https://www.telerik.com/blazor-ui/documentation/components/grid/filter/checkboxlist#custom-data

Regards,
Nadezhda Tacheva
Progress Telerik

Enjoyed our products? Share your experience on G2 and receive a $25 Amazon gift card for a limited time!