Grid Filter Logic

[Vinith-kumar47]

in the below, I have shared my code to filter the logic in the grid based on the ownerfilter.

protected createToolbarExtensions() {
super.createToolbarExtensions();

let ownerFilter = this.addQuickFilter({
field: fld.OwnerId,
type: Serenity.LookupEditor,
options: {
lookupKey: Master.OwnerRow.lookupKey
}
}) as Serenity.LookupEditor;

        let sectorFilter = this.addQuickFilter({
            field: fld.SectorId,
            type: Serenity.LookupEditor,
            title: 'Do No',
            options: {
                lookupKey: WorkOrderDetailsRow.lookupKey
            }
        }) as Serenity.LookupEditor;
        ownerFilter.changeSelect2(e => {
            debugger;
            let ownerId = ownerFilter.value;
            let lookupKey = ownerId ? "DailyWork.DONumberOwnerLookup" : WorkOrderDetailsRow.lookupKey;

            sectorFilter.element.data("lookupKey", lookupKey);
            Q.reloadLookup(lookupKey);
            let lookup = Q.getLookup(lookupKey);

            let filteredItems = ownerId ? lookup.items.filter(x => x.OwnerId == ownerId) : lookup.items;

            let items = filteredItems.map(x => ({
                id: x.SectorId,
                text: x.DONumber
            }));
            sectorFilter.element.select2({ data: items });
        });

}

My requirement is,
1.while opening the grid, Do no filter to show all the do number lookup values, which is working fine.
2.After selecting the OwnerFilter , it has to show the Do number specific to the selected Ownerfilter and that is also working fine.

3.the issue is, after removing the ownerfilter selection, Do no filter loads all the lookups but not able to select the Do filter. it becomes unselectable only when the ownerfilter is removed. If I select the owner filter again then the Do filter is selectable.

Attached HTML code from the browser console,

0001

Attached screenshot: