blazorbootstrap icon indicating copy to clipboard operation
blazorbootstrap copied to clipboard

Grid Filter: How filter nested object?

Open ariadna-aldeguer opened this issue 5 months ago • 2 comments

Describe the bug Example, I have an employee who has a relationship with the jobs table. I want to filter by job name, how to do it?

I tried:

  • PropertyName="Job.Name"
  • PropertyName="Employee.Job.Name" SortKeySelector="item => item.Job.Name"
public class Job
 {
     public int Id { get; set; }
     public string Name { get; set; }
 }
 public class Employee
 {
     public int Id { get; set; }
     public int JobId { get; set; }
     public virtual Job Job { get; set; }
 }

Versions (please complete the following information):

  • BlazorBootstrap: [e.g. 1.9.0, 19.2, 19.3]
  • Blazor WebAssembly / Server: Server
  • .NET Version: NET8

Sample code

@rendermode InteractiveServer
@page "/sample"
@attribute [StreamRendering]

<Grid @ref="grid"
      TItem="Employee"
      Class="table table-hover table-bordered table-striped"
      DataProvider="EmployeesDataProvider"
      AllowFiltering="true"
      Responsive="true"
      AllowPaging="true" PageSize="20"
      AllowSorting="true"
      EmptyText="No hay registros para mostrar"
      ItemsPerPageText="Items por página"
      Height="500"
      AutoHidePaging="true"
      FixedHeader="true"
      PageSizeSelectorItems="@(new int[] { 5,10,20 })"
      PaginationItemsTextFormat="{0} - {1} de {2} items">

    <GridColumn TItem="Employee" HeaderText="Id" PropertyName="Id">
        @context.Id
    </GridColumn>
    <GridColumn TItem="Employee" HeaderText="Job" PropertyName="Job.Name">
        @context.Job.Name
    </GridColumn>
   

</Grid>

@code {
    BlazorBootstrap.Grid<Employee> grid = default!;
    private IEnumerable<Employee> employees = default!;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await base.OnAfterRenderAsync(firstRender);
    }

    private async Task<GridDataProviderResult<Employee>> EmployeesDataProvider(GridDataProviderRequest<Employee> request)
    {
        if (employees is null) // pull employees only one time for client-side filtering, sorting, and paging
            employees = GetEmployees(); // call a service or an API to pull the employees

        return await Task.FromResult(request.ApplyTo(employees));
    }

    private IEnumerable<Employee> GetEmployees()
    {
        List<Job> jobs = new List<Job>
        {
            new Job { Id = 1, Name = "Software Developer" },
            new Job { Id = 2, Name = "Database Administrator" },
        };

        return new List<Employee>
        {
            new Employee { Id = 107, JobId = 1, Job = jobs.Find(job => job.Id == 1) },
            new Employee { Id = 108, JobId = 2, Job = jobs.Find(job => job.Id == 2) },
        };
    }
    public class Job
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }
    public class Employee
    {
        public int Id { get; set; }
        public int JobId { get; set; }
        public virtual Job Job { get; set; }
    }
}

ariadna-aldeguer avatar Feb 02 '24 17:02 ariadna-aldeguer

Are there any plans to support this @gvreddy04? Would be a good feature to see!

OllieFox131 avatar Mar 01 '24 16:03 OllieFox131

@OllieFox131 Yes, we will include it in the April/May release. We are planning more grid enhancements during the April/May timeframe.

gvreddy04 avatar Mar 01 '24 17:03 gvreddy04