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

Grid Filtering

9 Answers 1324 Views

General Discussions

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

9 Answers, 1 is accepted

Accepted

answered on 06 May 2019, 05:37 AM

Hello Peter,

You are not missing anything. At the moment, the grid filtering only supports one operation per field type as explained in the following article: https://docs.telerik.com/blazor-ui/components/grid/filtering.

The Blazor grid component is very young (literally, a couple of months old), and we are building it from the ground up so it fits the appropriate Blazor patterns and approaches. This means that it will take some time for it to catch up to other suites that have been in development for over a decade. We have improvements in the filtering area on our radar, and we intend to have more advanced features in the grid as soon as possible.

Regards,
Marin Bratanov
Progress TelerikUI for Blazor

answered on 06 May 2019, 06:45 AM

Hi Marin,
an universal filter is important. The actual implementation of the EqualsTo/Contains operator is only a starting point.

Mostly the Kendo UI grid behavior is enough: For all columns all possible operators, combined with AND.

With the grid compont of Telerik UI for WinForms I can create more complex filter.

A good approach is also the table filter in DBeaver: The result of the filters (the part after WHERE in SQL statement) is shown over the table in a textbox and can be edited.

The user can create a basic filter by the UI (like in Kendo UI) and modify it later in the textbox - replace AND by OR, set brackets around part of the filter text ...

Regards,

Peter

answered on 16 Mar 2020, 09:46 AM

Hello,

I followed the instructions for installing Blazor Telerik.

Everything works fine, accept the filtering. I used this example:

@page "/"

<TelerikGrid Data=@GridData Pageable="true" Height="400px" FilterMode="GridFilterMode.FilterMenu" >
<GridColumns>
<GridColumn Field=@nameof(Employee.Name) />
<GridColumn Field=@nameof(Employee.AgeInYears) Title="Age" />
<GridColumn Field=@nameof(Employee.HireDate) Title="Hire Date" />
<GridColumn Field=@nameof(Employee.IsOnLeave) Title="On Vacation" />
</GridColumns>
</TelerikGrid>

@code {
public List<Employee> GridData { get; set; }

protected override void OnInitialized()
{
GridData = new List<Employee>();
var rand = new Random();
for (int i = 0; i < 100; i++)
{
GridData.Add(new Employee()
{
EmployeeId = i,
Name = "Employee " + i.ToString(),
AgeInYears = rand.Next(10, 80),
HireDate = DateTime.Now.Date.AddDays(rand.Next(-20, 20)),
IsOnLeave = i % 3 == 0
});
}
}

public class Employee
{
public int? EmployeeId { get; set; }
public string Name { get; set; }
public int? AgeInYears { get; set; }
public DateTime HireDate { get; set; }
public bool IsOnLeave { get; set; }
}
}

but returns an unexpected error:

An unhandled exception occurred while processing the request.
NullReferenceException: Object reference not set to an instance of an object.
Telerik.Blazor.Components.RootComponent.TelerikRootComponentFragmentBase.Dispose()

answered on 16 Mar 2020, 11:05 AM

Hello Sander,

Could you check in your _Imports.razor file for the following using statements:

@using Telerik.Blazor
@using Telerik.Blazor.Components

Another thing you should check for is the <TelerikRootComponent> in the MainLayout.razor (located in your Shared folder). It should look like this:

@inherits LayoutComponentBase

<TelerikRootComponent>

    <div class="sidebar">
        <NavMenu />
    </div>

    <div class="main">
        @Body
    </div>

</TelerikRootComponent>

You can find more information on the steps described above in:

This article: https://docs.telerik.com/blazor-ui/getting-started/what-you-need
This tutorial: https://docs.telerik.com/blazor-ui/getting-started/server-blazor

Regards,
Svetoslav Dimitrov
Progress Telerik

UI for Blazor