search

mistic100 / jQuery-QueryBuilder

jQuery plugin offering an interface to create complex queries
https://querybuilder.js.org
MIT License
1.68k stars 552 forks source link

Filters for custom group type #937

Closed MiteshJ-Hub closed 2 years ago

MiteshJ-Hub commented 2 years ago

Hi,

We were trying to use jQuery Query Builder for multiple predefined group types.

You can see in this https://codepen.io/eonian_mitesh/pen/mdBRxOX?editors=0010 how we have started.

You will see in the above codepen sample that we have a common list of filters with a custom 'group' property. When you click on Add group, it will ask which type of group you want to add. When you will try to add a rule for any group, it will show all the filters in the filter dropdown box as I haven't added any special logic to filter/refine the filters list.

What we want is, if add a group of type e.g. RISK then it should show only 3 filter items having 'group' property value to be 'RISK' and same for other group type.

FYI - I have tried refining the querybuilder.filters list in the event called 'beforeAddRule' and it was showing a refined list but looks like it is also changing the component's model itself and was getting issues. Didn't added that kind of custom logic in the codepen to make it clear for you.

Any help would be appreciable.

Thanks, Mitesh J

mistic100 commented 2 years ago

  1. remove your global currentGroupType variable, such context-less variable are usually a very bad idea

  2. also remove the beforeAddRule listener, as you experienced it the list of filters should not be directly modified (the change-filter plugin does it in a controlled way)

  3. add a custom data to your group

$builderEl.queryBuilder('addGroup', $builderEl.queryBuilder('getModel'), false, { key });
  1. use the getRuleFilters filter event
$builderEl.on('getRuleFilters.queryBuilder.filter', (e, filters, rule) => {
  e.value = filters.filter(f => f.group === rule.parent.data.key);
});
  1. instead of redefine the whole template in getGroupTemplate you should alter it

Check how it is done here https://github.com/mistic100/jQuery-QueryBuilder/blob/dev/src/plugins/not-group/plugin.js#L34-L42

Didn't added that kind of custom logic in the codepen to make it clear for you.

I hope more request are like this, thank you very much.