a month ago
Dear Experts,
I hope this message finds you well.
I am currently working on a project that involves two dropdown menus. The first dropdown, Box 1, displays a list of manufacturers, such as A and B. The second dropdown, Box 2, presents the corresponding models for each manufacturer, for instance, A1, A2, A3 for manufacturer A, and B1, B2, B3 for manufacturer B.
Upon initial load, Box 1 defaults to manufacturer A, and Box 2 contains all models (A1, A2, A3, B1, B2, B3), with A1 being the pre-selected model.
My objective is to dynamically filter the options in Box 2 based on the selection made in Box 1. I attempted to implement this functionality using the following code snippet, but it was unsuccessful:
Nevertheless, I managed to achieve the desired outcome by hardcoding the filter value as shown below:
items = {
path: '/SprayModelSet',
filters: [{ path: 'SprayMachineMake', operator: 'EQ', value1: 'A' }],
sorter: { path: 'SprayMachineModel' }
};
This code effectively narrows down the options in Box 2 to A1, A2, A3, with A1 as the default selection, while excluding the B series models.
However, I am encountering difficulties in making the filter dynamic, such that the selected value from Box 1 is passed as a filter to Box 2.
Could you please provide guidance on how to achieve this dynamic filtering?
Thank you for your assistance.
Warm regards,
Pablo Ghosh Roy
Hi,
For dynamically, the select has change event. Please try below code sample in the event.
var oSelect1 = oEvent.getSource();
var sSelectedKey = oSelect1.getSelectedKey();
var Filter = [new Filter("YOUR_FIELD", FilterOperator.EQ, sSelectedKey )];
var oSelect2 = this.byId("YOUR_SECOND_DROPBOX_ID"),
oTemplate = oTable.getBindingInfo("items").template;
oSelect2 .unbindAggregation("items");
oSelect2 .bindItems({
path: "/YOUR_ENTITYSET",
template: oTemplate,
filters: aFilter,
events: {
dataRequested: function() {},
dataReceived: function() {}
}});
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Greetings, thank you for the suggestion. The code is helpful; but the problem is when the Select 2 first loads, it will still show all the 6 values irrespective of the value selected in Control 1. The logic above works when I have selected a new value in Select 1 which will of course trigger the change event hence binding new items to Select 2. What I was trying basically is when the Select 1 & 2 are initially loaded on screen; using the expression binding in some way it will send a request to back end with the filter so that it gets the filtered list. Hope I am making sense :).
User | Count |
---|---|
76 | |
8 | |
8 | |
8 | |
7 | |
6 | |
5 | |
5 | |
5 | |
5 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.