Advanced Filters Independent of Columns #501

Closed
opened 2026-01-29 17:38:18 +00:00 by claunia · 3 comments
Owner

Originally created by @wakudrle on GitHub (Aug 8, 2022).

First of all, thanks for an awesome set of components, and for making the Blazor components free to use. And thank you in advance for considering this possibility.

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

We have a current application that uses the Yii PHP framework. It has a pretty good Data Grid component, especially considering that we are using version 1.1 from over 10 years ago. But we would like to move to Blazor and Radzen in the future. For the Yii Data Grid, we use filtering that is separate from the columns. Below is a screen shot from our current application.

image

Describe the solution you'd like
A clear and concise description of what you want to happen.

Ideally we would like to have similar functionality as we have in the Yii application when we move to Radzen. Then we can have additional filters for data that is not shown in the columns, but is part of the dataset that is being partially shown in the data grid. In other words, it would be great to have the advanced filters that are available on the Radzen columns be available independently from the data grid display and yet be used to filter values in the Radzen data grid output.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

We currently have the Yii solution as shown above. and as attached

Additional context
Add any other context or screenshots about the feature request here.

meta-filters

Originally created by @wakudrle on GitHub (Aug 8, 2022). <!-- IMPORTANT: Read this first!!! 1. If you own a Radzen Professional or Еnterprise subscription you can request your feature via email at info@radzen.com. Radzen staff will reply within 24 hours (Professional) or 16 hours (Enterprise) 2. The Radzen staff guarantees a response to issues in this repo only to paid subscribers. 3. If you have a HOW TO question start a new forum thread in the Radzen Community forum: https://forum.radzen.com. Radzen staff will close issues that are HOWTO questions. 4. Please adhere to the issue template. --> First of all, thanks for an awesome set of components, and for making the Blazor components free to use. And thank you in advance for considering this possibility. **Is your feature request related to a problem? Please describe.** A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] We have a current application that uses the Yii PHP framework. It has a pretty good Data Grid component, especially considering that we are using version 1.1 from over 10 years ago. But we would like to move to Blazor and Radzen in the future. For the Yii Data Grid, we use filtering that is separate from the columns. Below is a screen shot from our current application. ![image](https://user-images.githubusercontent.com/101423/183509027-f5d6e6a9-540d-48c3-bd40-7cf04dbb040c.png) **Describe the solution you'd like** A clear and concise description of what you want to happen. Ideally we would like to have similar functionality as we have in the Yii application when we move to Radzen. Then we can have additional filters for data that is not shown in the columns, but is part of the dataset that is being partially shown in the data grid. In other words, it would be great to have the advanced filters that are available on the Radzen columns be available independently from the data grid display and yet be used to filter values in the Radzen data grid output. **Describe alternatives you've considered** A clear and concise description of any alternative solutions or features you've considered. We currently have the Yii solution as shown above. and as attached **Additional context** Add any other context or screenshots about the feature request here. ![meta-filters](https://user-images.githubusercontent.com/101423/183509629-e672a19c-2df6-4b3f-8d12-fc3b1840daf4.png)
Author
Owner

@enchev commented on GitHub (Aug 9, 2022):

Thanks for the suggestion! This looks like completely new component to me, maybe RadzenFilter that will accept Data and will provide View property that other data components like RadzenDataGrid will be able to consume.

@enchev commented on GitHub (Aug 9, 2022): Thanks for the suggestion! This looks like completely new component to me, maybe RadzenFilter that will accept Data and will provide View property that other data components like RadzenDataGrid will be able to consume.
Author
Owner

@bengavin commented on GitHub (Aug 24, 2022):

@wakudrle - Maybe not as easy as a built-in control, but this functionality should also be possible by implementing the 'LoadData' method on the grid, along with a custom filter control of your own creation. The custom filter control could either expose a 'LoadDataArgs' parameter that you could bind, or maybe simpler expose a 'FilterString' bound property that could be added to your query as you're building the current data page.

We often use a pattern such as:

<RadzenDataGrid @ref="dataGrid"
        TItem="SomeDataClass" 
        IsLoading=@(__isLoading || LoadingState || !__hasLoaded)
        LoadData=@LoadGridData
        EmptyText="No data available">
...
</RadzenDataGrid>
    // ...
   bool __isLoading = false;
   bool __hasLoaded = false;
   // ... LoadingState comes from a base control that handles pre-assigning grid sort/filters based on user state
   // ... which sometimes causes the LoadGridData to be called 'prematurely'
    protected async Task LoadGridData(LoadDataArgs args)
    {
        if (__isLoading || LoadingState) { return; } // don't do anything here (re-entrant or premature)

        __isLoading = true;
        await Task.Yield(); // allow the loading indicator to render

        var query = dataService.GetBaseQueryable(/* [some args] */);

        // *** This is where you could pull the filter from the external control vs. what the grid provides
        if (!string.IsNullOrWhiteSpace(args.Filter))
        {
            query = query.Where(args.Filter);
        }

        var needsCount = __lastFilter == null || !string.Equals(__lastFilter, args.Filter);
        __lastFilter = args.Filter; // or your custom filter string from above

        var count = needsCount ? query.Count() : dataGrid.Count;

        if (!string.IsNullOrWhiteSpace(args.OrderBy))
        {
            query = query.OrderBy(args.OrderBy);
        }

        if (args.Skip.HasValue) { query = query.Skip(args.Skip.Value); }
        if (args.Top.HasValue) { query = query.Take(args.Top.Value); }

        var listData = await query.ToListAsync();
        dataGrid.Data = listData;
        if (needsCount || listData.Count == 0) // ensure empty text shows up
        {
            dataGrid.Count = count;
        }

        __isLoading = false;
        __hasLoaded = true;
    }
@bengavin commented on GitHub (Aug 24, 2022): @wakudrle - Maybe not as easy as a built-in control, but this functionality should also be possible by implementing the 'LoadData' method on the grid, along with a custom filter control of your own creation. The custom filter control could either expose a 'LoadDataArgs' parameter that you could bind, or maybe simpler expose a 'FilterString' bound property that could be added to your query as you're building the current data page. We often use a pattern such as: ```razor <RadzenDataGrid @ref="dataGrid" TItem="SomeDataClass" IsLoading=@(__isLoading || LoadingState || !__hasLoaded) LoadData=@LoadGridData EmptyText="No data available"> ... </RadzenDataGrid> ``` ```csharp // ... bool __isLoading = false; bool __hasLoaded = false; // ... LoadingState comes from a base control that handles pre-assigning grid sort/filters based on user state // ... which sometimes causes the LoadGridData to be called 'prematurely' protected async Task LoadGridData(LoadDataArgs args) { if (__isLoading || LoadingState) { return; } // don't do anything here (re-entrant or premature) __isLoading = true; await Task.Yield(); // allow the loading indicator to render var query = dataService.GetBaseQueryable(/* [some args] */); // *** This is where you could pull the filter from the external control vs. what the grid provides if (!string.IsNullOrWhiteSpace(args.Filter)) { query = query.Where(args.Filter); } var needsCount = __lastFilter == null || !string.Equals(__lastFilter, args.Filter); __lastFilter = args.Filter; // or your custom filter string from above var count = needsCount ? query.Count() : dataGrid.Count; if (!string.IsNullOrWhiteSpace(args.OrderBy)) { query = query.OrderBy(args.OrderBy); } if (args.Skip.HasValue) { query = query.Skip(args.Skip.Value); } if (args.Top.HasValue) { query = query.Take(args.Top.Value); } var listData = await query.ToListAsync(); dataGrid.Data = listData; if (needsCount || listData.Count == 0) // ensure empty text shows up { dataGrid.Count = count; } __isLoading = false; __hasLoaded = true; } ```
Author
Owner

@enchev commented on GitHub (Sep 21, 2022):

New DataFilter component can be used in such scenarios: a53022bac0
image

@enchev commented on GitHub (Sep 21, 2022): New DataFilter component can be used in such scenarios: https://github.com/radzenhq/radzen-blazor/commit/a53022bac01a52e68fd040233e4abd8ba1d6639d ![image](https://user-images.githubusercontent.com/5804953/191459945-2e296dab-fa60-41c5-bff3-ef064649b963.png)
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/radzen-blazor#501