I'm using jQuery QueryBuilder, and I noticed that when changing the left-hand side field, the operator resets automatically. I understand this is built-in behavior since different fields may support different operators.
Looking into the source code, I found this behavior in core.js:
// set the operator without triggering update event
if (rule.filter.default_operator) {
rule.__.operator = this.getOperatorByType(rule.filter.default_operator);
}
else {
rule.__.operator = operators[0];
}
(Reference: QueryBuilder Source Code)
However, in my use case, I'd like to retain the previously selected operator whenever possible.
Is there a way to override this behavior and prevent the operator from resetting unnecessarily? Any suggestions or workarounds would be greatly appreciated!
We can fix this by keeping track of the operator for each rule.
const [ruleOperators, setRuleOperators] = useState({});
We can do that by using afterUpdateRuleOperator.queryBuilder
$('#builder').on('afterUpdateRuleOperator.queryBuilder', (e, rule) => {
setRuleOperators(prev => ({
...prev,
[rule.id]: rule.operator,
}));
});
Then update the rule with previous operator immediately after changing the field using afterUpdateRuleFilter.queryBuilder
$('#builder').on('afterUpdateRuleFilter.queryBuilder', (e, rule) => {
const prevOp = ruleOperators[rule.id];
if (prevOp) {
rule.operator = prevOp;
$('#builder').queryBuilder('trigger', 'afterUpdateRuleOperator', rule);
}
});