Syncfusion.Blazor.QueryBuilder 33.1.45

Prefix Reserved
.NET 8.0 This package targets .NET 8.0. The package is compatible with this framework or higher. 
dotnet add package Syncfusion.Blazor.QueryBuilder --version 33.1.45
                    


                    

                
NuGet\Install-Package Syncfusion.Blazor.QueryBuilder -Version 33.1.45
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package. 
<PackageReference Include="Syncfusion.Blazor.QueryBuilder" Version="33.1.45" />
For projects that support PackageReference, copy this XML node into the project file to reference the package. 
<PackageVersion Include="Syncfusion.Blazor.QueryBuilder" Version="33.1.45" />
                    


                            Directory.Packages.props
                        

                    

                
<PackageReference Include="Syncfusion.Blazor.QueryBuilder" />
                    


                            Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package. 
paket add Syncfusion.Blazor.QueryBuilder --version 33.1.45
                    


                    

                
#r "nuget: Syncfusion.Blazor.QueryBuilder, 33.1.45"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package. 
#:package Syncfusion.Blazor.QueryBuilder@33.1.45
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package. 
#addin nuget:?package=Syncfusion.Blazor.QueryBuilder&version=33.1.45
                    


                            Install as a Cake Addin
                        

                    

                
#tool nuget:?package=Syncfusion.Blazor.QueryBuilder&version=33.1.45
                    


                            Install as a Cake Tool

Syncfusion® Blazor QueryBuilder Component

The Syncfusion® Blazor QueryBuilder Component enables building and editing complex filter conditions with a visual interface. It generates structured JSON filters that convert to SQL queries, supports AND/OR logic grouping, and integrates seamlessly with data grids and charts for advanced data filtering in Blazor applications.

Key Features

  • Visual Query Builder – Intuitive UI for building complex filter conditions
  • Multiple Condition Types – Support for various operators (equals, contains, between, etc.)
  • Grouping Logic – Combine conditions with AND/OR operators
  • JSON Query Output – Structured JSON filters for easy SQL query generation
  • Customizable Fields – Define filterable columns and data types
  • Template Support – Custom templates for values, operators, and conditions
  • Data Visualization Integration – Works with DataGrid, Charts, and other components
  • Keyboard Navigation – Full accessibility support

System Requirements

  • .NET 8.0 or later (Blazor Web App, Blazor Server, Blazor WebAssembly and Blazor Hybrid)
  • See full requirements: System Requirements

Blazor QueryBuilder

Installation

.NET CLI

dotnet add package Syncfusion.Blazor.QueryBuilder

NuGet Package Manager

Install-Package Syncfusion.Blazor.QueryBuilder

Add Stylesheet and Script References

  • For Blazor Server App / Blazor Web App, add these to Components/App.razor or App.razor.
  • For Blazor WebAssembly App: add these to wwwroot/index.html.
<link href="_content/Syncfusion.Blazor.Themes/bootstrap5.css" rel="stylesheet" />
<script src="_content/Syncfusion.Blazor.Core/scripts/syncfusion-blazor.min.js" type="text/javascript"></script>

Quick Start

  1. Register the Syncfusion® Blazor services in Program.cs:
using Syncfusion.Blazor;

builder.Services.AddSyncfusionBlazor();
  1. Add the Blazor QueryBuilder component in a Razor page:
<SfQueryBuilder TValue="EmployeeDetails">
    <QueryBuilderColumns>
        <QueryBuilderColumn Field="EmployeeID" Label="Employee ID" Type="ColumnType.Number"></QueryBuilderColumn>
        <QueryBuilderColumn Field="FirstName" Label="First Name" Type="ColumnType.String"></QueryBuilderColumn>
        <QueryBuilderColumn Field="TitleOfCourtesy" Label="Title of Courtesy" Type="ColumnType.Boolean" Values="Values"></QueryBuilderColumn>
        <QueryBuilderColumn Field="Title" Label="Title" Type="ColumnType.String"></QueryBuilderColumn>
        <QueryBuilderColumn Field="HireDate" Label="Hire Date" Type="ColumnType.Date"></QueryBuilderColumn>
        <QueryBuilderColumn Field="Country" Label="Country" Type="ColumnType.String"></QueryBuilderColumn>
        <QueryBuilderColumn Field="City" Label="City" Type="ColumnType.String"></QueryBuilderColumn>
    </QueryBuilderColumns>
</SfQueryBuilder>

@code {
    private string[] Values = new string[] { "Mr.", "Mrs." };
    public class EmployeeDetails
    {
        public int EmployeeID { get; set; }
        public string FirstName { get; set; }
        public bool TitleOfCourtesy { get; set; }
        public string Title { get; set; }
        public DateTime HireDate { get; set; }
        public string Country { get; set; }
        public string City { get; set; }
    }
}

Documentation

Support

License

This is a commercial product and requires a paid license for possession or use. Review the Syncfusion® EULA.

About Syncfusion®

Syncfusion® provides 1600+ UI components and frameworks for web, mobile, and desktop development across multiple platforms:

Learn more at www.syncfusion.com.

sales@syncfusion.com | Toll Free: 1-888-9-DOTNET

Product Compatible and additional computed target framework versions.
.NET net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 is compatible.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed.  net10.0 is compatible.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages (3)

Showing the top 3 NuGet packages that depend on Syncfusion.Blazor.QueryBuilder:

Package Downloads
NCPC.Blazor

Set of Blazor components to user within your project
Recrovit.RecroGridFramework.Client.Blazor.SyncfusionUI

RecroGrid Framework Blazor UI.
Jakar.Extensions.Blazor.Syncfusion

Extensions to aid in development.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
33.1.45 91 3/23/2026
33.1.44 301 3/16/2026
32.2.9 574 3/9/2026
32.2.8 573 3/2/2026
32.2.7 704 2/23/2026
32.2.5 326 2/16/2026
32.2.4 388 2/10/2026
32.2.3 1,174 2/5/2026
32.1.25 492 1/26/2026
32.1.24 1,709 1/19/2026
32.1.23 361 1/13/2026
32.1.22 708 1/5/2026
32.1.21 1,043 12/29/2025
32.1.20 291 12/23/2025
32.1.19 908 12/16/2025
31.2.18 977 12/8/2025
31.2.16 1,163 12/1/2025
31.2.15 357 11/25/2025
31.2.12 950 11/18/2025
31.2.10 492 11/12/2025
Loading failed

https://blazor.syncfusion.com/documentation/release-notes/33.1.45/?utm_source=nuget&utm_medium=listing