Back to Devexpress

GridFilterPanelDisplayMode Enum

blazor-devexpress-dot-blazor-cf0ae268.md

latest7.4 KB
Original Source

GridFilterPanelDisplayMode Enum

Lists values that specify filter panel visibility.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
public enum GridFilterPanelDisplayMode

Members

NameDescription
Never

The filter panel is hidden.

| | Always |

The filter panel is always visible.

| | Auto |

The filter panel appears when data is filtered (otherwise, the panel is hidden).

|

The following properties accept/return GridFilterPanelDisplayMode values:

LibraryRelated API Members
BlazorDxGrid.FilterPanelDisplayMode
IGrid.FilterPanelDisplayMode
XAF: Cross-Platform .NET App UI & Web APIDxGridModel.FilterPanelDisplayMode

Remarks

The Grid component ships with an integrated filter panel. This panel includes the following elements:

  • The filter toggle that allows users to temporarily deactivate the filter.
  • The current filter condition. Users can click it to open the filter builder dialog and customize the filter.
  • The Clear Filter button.

Read Tutorial: Filter Panel and Filter Builder Run Demo: Filter Panel

Assign Auto to FilterPanelDisplayMode to display the filter panel only when Grid data is filtered. The panel remains visible after the filter is temporarily deactivated (disappears only after the filter is cleared).

To display the filter panel permanently, set the FilterPanelDisplayMode property to Always:

razor
@inject NwindDataService NwindDataService

<DxGrid @ref="Grid"
        Data="Data"
        FilterMenuButtonDisplayMode="GridFilterMenuButtonDisplayMode.Always"
        FilterPanelDisplayMode="GridFilterPanelDisplayMode.Always">
    <Columns>
        <DxGridDataColumn FieldName="SalesPerson" Caption="Salesperson" />
        <DxGridBandColumn Caption="Order">
            <Columns>
                <DxGridDataColumn FieldName="CompanyName" />
                <DxGridDataColumn FieldName="OrderDate" Caption="Date" />
                <DxGridBandColumn Caption="Product">
                    <Columns>
                        <DxGridDataColumn FieldName="ProductName" Caption="Name" />
                        <DxGridDataColumn FieldName="UnitPrice" DisplayFormat="c"
                                          CaptionAlignment="GridTextAlignment.Right" />
                    </Columns>
                </DxGridBandColumn>
                <DxGridDataColumn FieldName="Quantity" />
            </Columns>
        </DxGridBandColumn>
    </Columns>
</DxGrid>

@code {
    object Data { get; set; }
    IGrid Grid { get; set; }

    protected override async Task OnInitializedAsync() {
        var invoices = await NwindDataService.GetInvoicesAsync();
        var customers = await NwindDataService.GetCustomersAsync();
        Data = invoices.OrderBy(i => i.OrderDate).Join(customers, i => i.CustomerId, c => c.CustomerId,
            (i, c) => { return new {
                CompanyName = c.CompanyName,
                SalesPerson = i.Salesperson,
                UnitPrice = i.UnitPrice,
                OrderDate = i.OrderDate,
                ProductName = i.ProductName,
                Quantity = i.Quantity
            };
        });
    }
    protected override Task OnAfterRenderAsync(bool firstRender) {
        if (firstRender)
            Grid.SetFilterCriteria(CriteriaOperator.Parse("[UnitPrice] > 100M" +
                                                  "And ([SalesPerson] In ('Robert King', 'Andrew Fuller')" +
                                                  "Or [CompanyName] == 'Ernst Handel')"));
        return base.OnAfterRenderAsync(firstRender);
    }
}
csharp
using System;
using System.Collections.Generic;
using System.Runtime.InteropServices;

namespace BlazorDemo.Data.Northwind {
    public class Invoice {
        public string ShipName { get; set; }
        public string ShipAddress { get; set; }
        public string ShipCity { get; set; }
        public string ShipRegion { get; set; }
        public string ShipPostalCode { get; set; }
        public string ShipCountry { get; set; }
        public string CustomerId { get; set; }
        public string CustomerName { get; set; }
        public string Address { get; set; }
        public string City { get; set; }
        public string Region { get; set; }
        public string PostalCode { get; set; }
        public string Country { get; set; }
        public string Salesperson { get; set; }
        public int OrderId { get; set; }
        public DateTime? OrderDate { get; set; }
        public DateTime? RequiredDate { get; set; }
        public DateTime? ShippedDate { get; set; }
        public string ShipperName { get; set; }
        public int ProductId { get; set; }
        public string ProductName { get; set; }
        public decimal UnitPrice { get; set; }
        public short Quantity { get; set; }
        public float Discount { get; set; }
        public decimal? ExtendedPrice { get; set; }
        public decimal? Freight { get; set; }
    }
}
csharp
using System;
using System.Collections.Generic;
using System.Runtime.InteropServices;

namespace BlazorDemo.Data.Northwind {
    public partial class Customer {
        public Customer() {
            Orders = new HashSet<Order>();
        }

        public string CustomerId { get; set; }
        public string CompanyName { get; set; }
        public string ContactName { get; set; }
        public string ContactTitle { get; set; }
        public string Address { get; set; }
        public string City { get; set; }
        public string Region { get; set; }
        public string PostalCode { get; set; }
        public string Country { get; set; }
        public string Phone { get; set; }
        public string Fax { get; set; }

        public virtual ICollection<Order> Orders { get; set; }
    }
}
csharp
using System.Collections.Generic;
using System.Linq;
using System.Threading;
using System.Threading.Tasks;
using BlazorDemo.Data.Northwind;
using BlazorDemo.DataProviders;

namespace BlazorDemo.Services {
    public partial class NwindDataService {
        public Task<IEnumerable<Invoice>> GetInvoicesAsync(CancellationToken ct = default) {
            // Return your data here
        }
        public Task<IEnumerable<Customer>> GetCustomersAsync(CancellationToken ct = default) {
            // Return your data here
        }
    }
}
csharp
// ...
builder.Services.AddScoped<NwindDataService>();

See Also

DevExpress.Blazor Namespace