QueryBuilderModel

23 Sep 20253 minutes to read

Interface for a class QueryBuilder

Properties

actionBegin EmitType<ActionEventArgs>

Triggers when field, operator, value is change.

beforeChange EmitType<ChangeEventArgs>

Triggers before the condition (And/Or), field, operator, value is changed.

change EmitType<ChangeEventArgs>

Triggers when changing the condition(AND/OR), field, value, operator is changed.

created EmitType<Event>

Triggers when the component is created.

dataBound EmitType<Object>

Triggers when dataBound to the Query Builder.

ruleChange EmitType<RuleChangeEventArgs>

Triggers when changing the condition(AND/OR), field, value, operator is changed

addRuleToNewGroups boolean

Specifies a boolean value whether enable / disable the new rule adding while adding new groups.

allowDragAndDrop boolean

Specifies a boolean value whether to enable / disable the drag and drop support to move the rules/ groups.

allowValidation boolean

Enables or disables the validation.

autoSelectField boolean

Specifies a boolean value whether enable / disable the auto selection with the first value for the field.

autoSelectOperator boolean

Specifies a boolean value whether enable / disable the auto selection with the first value for the operator.

columns ColumnsModel[]

Specifies columns to create filters.

cssClass string

Defines class or multiple classes, which are separated by a space in the QueryBuilder element.
You can add custom styles to the QueryBuilder using the cssClass property.

dataSource Object[]|Object|DataManager

Binds the column name from data source in query-builder.
The dataSource is an array of JavaScript objects.

displayMode DisplayMode

Specifies the displayMode as Horizontal or Vertical.

drag EmitType<DragEventArgs>

Triggers when rule/ group are dragged (moved) continuously.

dragStart EmitType<DragEventArgs>

Triggers when rule/ group dragging starts.

drop EmitType<DropEventArgs>

Triggers when rule/ group are dropped on to the target rule/ group.

enableNotCondition boolean

Enables/Disables the not group condition in query builder.

enablePersistence boolean

Enable or disable persisting component’s state between page reloads.
If enabled, filter states will be persisted.

enableRtl boolean

Enable or disable rendering component in right to left direction.

enableSeparateConnector boolean

Specifies whether to enable separate connectors between rules/groups.

fieldMode FieldMode

Specifies the fieldMode as DropDownList or DropDownTree.

fieldModel DropDownListModel|DropDownTreeModel

Specifies the property for field.

headerTemplate string|Function

Specifies the template for the header with any other widgets.

height string

Specifies the height of the query builder.

immediateModeDelay number

If immediateModeDelay is set by particular number, the rule Change event is triggered after that period.

locale string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

matchCase boolean

If match case is set to true, the grid filters the records with exact match.
if false, it filters case insensitive records (uppercase and lowercase letters treated the same).

maxGroupCount number

Specifies the maximum group count or restricts the group count.

operatorModel DropDownListModel

Specifies the property for operator.

readonly boolean

When set to true, the user interactions on the component are disabled.

rule RuleModel

Defines rules in the QueryBuilder.
Specifies the initial rule, which is JSON data.

separator string

Specifies the separator string for column.

showButtons ShowButtonsModel

Specifies the showButtons settings of the query builder component.
The showButtons can be enable Enables or disables the ruleDelete, groupInsert, and groupDelete buttons.

sortDirection SortDirection

Specifies the sort direction of the field names.

summaryView boolean

Shows or hides the filtered query.

valueModel ValueModel

Specifies the property for value.

width string

Specifies the width of the query builder.