Filter over optionsGroup item selection

Hi,

I have done filtering over lookup field selection but now I’m trying to filter data over optionsGroup item selection.
ex- If I select ‘item1’ the table should display all the values containing ‘item1’ and similarly, de-selection leads back to normal table.

Is it possible? I haven’t found any examples related to this.

Thanks in advance.

Hi Sanchit,

You can use the selected value of your optionsGroup in the where-clause of the table’s row datasource:

<collectionDatasource id="filteredDs"
                      class="com.company.project.entity.MyTable"
                      view="myTable-view">
    <query>
        <!&#91;CDATA&#91;select e from project$MyTable e
        where e.item.id = :component$optionsGroup&#93;&#93;>
    </query>
</collectionDatasource>

…and update the datasource using the optionsGroup valueChangeListener:

@Override
public void init(Map<String, Object> params) {
    
    optionsGroup.addValueChangeListener(e -> {
        filteredDs.refresh();
    });
}

You can also look at the similar question here.

1 Like

Hi,

I was trying to use the similar approach but I got this error.

IllegalStateException: Query argument component_optionsGroup not found in the list of parameters provided during query execution.
IllegalArgumentException: You have attempted to set a value of type class java.util.ArrayList for parameter component_optionsGroup with expected type of class java.lang.String from query string select e from myproject$mytable e where e.type = :component_optionsGroup.

It seems you have the multiselect option enabled. In this case use the in operator in the where-clause:

where e.item.id in :component$entityOptionsGroup
1 Like

Yeah I was using multiselection option.
It works fine now…
Thank you

Is there a way initially to set all the options selected as a default?

Sure.

Use optionsGroup.setValue() in the init() method:

itemsDs.refresh();
optionsGroup.setValue(itemsDs.getItems());

perfect!

Thanks a ton.

Hi Olga…
I am looking for the same requirement as stated above. i did everything as stated above… I am using groupdatasource. After the page load, the table doesnt populate any rows… And multiselect optionsGroup is also not selected. I’ve set the query correctly

the code i use is:

optionsGroup.setValue(taskManagersDs.getItems())

But when i check the optionGroup manually it loads the table according to the selection.

Can you help me resolving this…

Hi,

Could you please share your screen’s descriptor and controller code. By the way, don’t forget to use triple back quotes for code blocks.

Descriptor Code:

<window xmlns="http://schemas.haulmont.com/cuba/window.xsd"
        caption="msg://browseCaption"
        class="com.ips.pjw.web.taskmanager.TaskManagerBrowse"
        focusComponent="taskManagersTable"
        lookupComponent="taskManagersTable"
        messagesPack="com.ips.pjw.web.taskmanager">
    <dsContext>
        <groupDatasource id="taskManagersDs"
                         class="com.ips.pjw.entity.taskmanagement.TaskManager"
                         view="taskManager-view">
            <query>
                <![CDATA[select e from pjw$TaskManager e
                where e.taskStatus in :component$optionsStatus and
                e.taskSeverity in :component$optionsSeverity
                ]]>
            </query>
        </groupDatasource>
    </dsContext>
    <dialogMode height="600"
                width="800"/>
    <layout expand="taskManagersTable_split"
            spacing="true">
        <filter id="filter"
                applyTo="taskManagersTable"
                datasource="taskManagersDs">
            <properties include=".*"/>
        </filter>
        <split id="taskManagersTable_split"
               orientation="horizontal"
               width="100%">
            <vbox height="100%"
                  margin="true">
                <groupTable id="taskManagersTable"
                            height="100%"
                            width="100%">
                    <actions>
                        <action id="create"/>
                        <action id="edit"/>
                        <action id="remove"/>
                    </actions>
                    <columns>
                        <column id="taskName"/>
                        <column id="startDate"/>
                        <column id="endDate"/>
                        <column id="taskStatus"/>
                        <column id="taskSeverity"/>
                        <column id="project"/>
                        <column id="taskTemplates"/>
                    </columns>
                    <rows datasource="taskManagersDs"/>
                    <rowsCount/>
                    <buttonsPanel id="buttonsPanel"
                                  alwaysVisible="true">
                        <button id="createBtn"
                                action="taskManagersTable.create"/>
                        <button id="editBtn"
                                action="taskManagersTable.edit"/>
                        <button id="removeBtn"
                                action="taskManagersTable.remove"/>
                    </buttonsPanel>
                </groupTable>
            </vbox>
            <vbox height="100%"
                  margin="true"
                  spacing="true">
                <accordion id="taskFilter"
                           height="100%">
                    <tab id="tab1"
                         caption="Task Type"
                         margin="true"
                         spacing="true">
                        <optionsGroup id="optionsType"/>
                    </tab>
                    <tab id="tab2"
                         caption="Task Status"
                         margin="true"
                         spacing="true">
                        <optionsGroup id="optionsStatus"
                                      multiselect="true"
                                      optionsEnum="com.ips.pjw.entity.taskmanagement.TaskStatus"/>
                    </tab>
                    <tab id="tab3"
                         caption="Task Severity"
                         margin="true"
                         spacing="true">
                        <optionsGroup id="optionsSeverity"
                                      multiselect="true"
                                      optionsEnum="com.ips.pjw.entity.taskmanagement.TaskSeverity"/>
                    </tab>
                </accordion>
            </vbox>
        </split>
    </layout>
</window>```

**Controller Code:**
```@Commentable(listComponent = "taskManagersTable")
public class TaskManagerBrowse extends AnnotatableAbstractLookup {

    @Inject
    @IconCommentedEntities(icon = 'font-icon:COMMENTING')
    Table<TaskManager> taskManagersTable

    @Inject
    private OptionsGroup optionsType

    @Inject
    private OptionsGroup optionsStatus

    @Inject
    private OptionsGroup optionsSeverity

    @Inject
    private GroupDatasource<TaskManager, UUID> taskManagersDs

    @Override
    void init(Map<String, Object> params) {
        taskManagersDs.refresh()
        optionsStatus.setValue(taskManagersDs.getItems())
        optionsSeverity.setValue(taskManagersDs.getItems())

        optionsStatus.addValueChangeListener(new Component.ValueChangeListener() {
            @Override
            public void valueChanged(Component.ValueChangeEvent e) {
                taskManagersDs.refresh()
            }
        })

        optionsSeverity.addValueChangeListener(new Component.ValueChangeListener() {
            @Override
            public void valueChanged(Component.ValueChangeEvent e) {
                taskManagersDs.refresh()
            }
        })
    }
}```

If possible please implement us a demo project. So, it can be easy to understand. thanks…

Hi Olga,
Is there any updates?

Initially, you can load all records with a simple datasource query: select e from pjw$TaskManager e, and add conditions only when the optionsGroup value is changed:

optionsStatus.addValueChangeListener(e -> {
    taskManagersDs.setQuery("select e from pjw$TaskManager e where e.taskStatus in :component$optionsStatus and e.taskSeverity in :component$optionsSeverity");
    taskManagersDs.refresh();
});

optionsSeverity.addValueChangeListener(e -> {
    taskManagersDs.setQuery("select e from pjw$TaskManager e where e.taskStatus in :component$optionsStatus and e.taskSeverity in :component$optionsSeverity");
    taskManagersDs.refresh();
});

demo.zip (82.0 KB)

Hi Olga thanks for the demo project. It works, but the optionGroup is not populated with values… Even i have included the following codes… But the checkboxes doesn’t get populated…

    @Override
    public void init(Map<String, Object> params) {
        taskManagersDs.refresh();
        optionsStatus.setValue(taskManagersDs.getItems());
        optionsSeverity.setValue(taskManagersDs.getItems());

        optionsStatus.addValueChangeListener(e -> {
            taskManagersDs.setQuery("select e from demo$TaskManager e where e.taskStatus in :component$optionsStatus and e.taskSeverity in :component$optionsSeverity");
            taskManagersDs.refresh();
        });
        optionsSeverity.addValueChangeListener(e -> {
            taskManagersDs.setQuery("select e from demo$TaskManager e where e.taskStatus in :component$optionsStatus and e.taskSeverity in :component$optionsSeverity");
            taskManagersDs.refresh();
        });
    }

I tried to put the setValue in ready method also, but it shows error...

Thanks....

The setValue() method of OptionsGroup takes a List of values, so try something like this:

<groupDatasource id="taskManagersDs"
                 class="com.company.demo.entity.TaskManager"
                 view="_local">
    <query>
        <![CDATA[select e from demo$TaskManager e where e.taskStatus in :component$optionsStatus and e.taskSeverity in :component$optionsSeverity]]>
    </query>
</groupDatasource>
@Override
public void init(Map<String, Object> params) {

    List<TaskStatus> statusList = Arrays.asList(TaskStatus.values());
    optionsStatus.setValue(statusList);

    List<TaskSeverity> severityList = Arrays.asList(TaskSeverity.values());
    optionsSeverity.setValue(severityList);

    optionsStatus.addValueChangeListener(e -> {
        taskManagersDs.refresh();
    });
    optionsSeverity.addValueChangeListener(e -> {
        taskManagersDs.refresh();
    });
}

Thanks Olga… It works as expected…