Lock Group/ Rule in Blazor QueryBuilder Component
26 Mar 20244 minutes to read
The Blazor Query Builder provides the functionality to lock individual rules or entire groups. When a rule is locked, it prevents users from modifying its field, operator, and value, effectively disabling these components. Similarly, locking a group disables all elements contained within it. This feature offers users greater control over their query configurations, ensuring that specific rules or groups remain unchanged. Additionally, users can manage the visibility of locking buttons through the ShowButtons function, allowing for seamless control over the locking mechanism.
You can lock
groups and rules by interacting through the user interface and methods.
@using Syncfusion.Blazor.QueryBuilder
@using Syncfusion.Blazor.Buttons
<SfQueryBuilder TValue="EmployeeDetails" @ref="QuerybuilderObj">
<QueryBuilderShowButtons RuleDelete="true" GroupDelete="true" GroupInsert="true" LockGroup="true" LockRule="true"></QueryBuilderShowButtons>
<QueryBuilderRule Condition="or" Rules="@Rules"></QueryBuilderRule>
<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"></QueryBuilderColumn>
<QueryBuilderColumn Field="HireDate" Label="Hire Date" Type="ColumnType.Date" Format="MM/dd/yyyy"></QueryBuilderColumn>
<QueryBuilderColumn Field="Country" Label="Country" Type="ColumnType.String"></QueryBuilderColumn>
</QueryBuilderColumns>
</SfQueryBuilder>
<SfButton @onclick="lockGroup" IsPrimary="true" Content="Lock Group"></SfButton>
<SfButton @onclick="lockRule" IsPrimary="true" Content="Lock Rule"></SfButton>
@code {
SfQueryBuilder<EmployeeDetails> QuerybuilderObj;
List<RuleModel> Rules = new List<RuleModel>()
{
new RuleModel { Field="Country", Label="Country", Type="String", Operator="equal", Value = "England" },
new RuleModel { Field="EmployeeID", Label="EmployeeID", Type="Number", Operator="notequal", Value = 1001 }
};
RuleModel SampRule = new RuleModel()
{
Label = "Employee ID",
Field = "EmployeeID",
Type = "Number",
Operator = "equal",
Value = 1091
};
RuleModel SampGroup = new RuleModel()
{
Condition = "or",
Rules = new List<RuleModel>()
{
new RuleModel()
{
Label = "Employee ID",
Field = "EmployeeID",
Type = "Number",
Operator = "equal",
Value = 1091
}
}
};
public string[] GroupID = new string[] { "group1" };
private void lockGroup()
{
QuerybuilderObj.LockGroup("group0");
}
private void lockRule()
{
QuerybuilderObj.LockRule("group0_rule0");
}
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; }
}
}
NOTE
You can also explore our Blazor Query Builder example to know how to render and configure the query builder.