Call a Query on selecting an item from a Dynamic Select List

refer this image:

the select list on left with 2 items (CB1, CB2) is dynamically generated.
the grid on right has dynamic repeat boxes with 2 items shown in each box from the database.

what we want to do is, on selection of CB1 from the list, the GRID on right side should filter with items which fall under CB1.

how do we set a dynamic action to run a query on selection of the one item from the list which will effect the view on the right side grid.

please help.

1 Like

Hi @nshkrsh,
That’s easy to achieve using 2 server actions with a query in each of them.

  • Server action with a database query for the category (CB1, CB2) which you bind in the left column
  • Server action with a database query for the records in the grid. In this server action, create a GET variable under globals. Call it … “filter” for example. Assign it as a value in the filters tab of the query builder.

On your page:

  • Add you server actions on the page (you need them to create the repeat regions)
  • Create a variable (insert > data > variable)
  • Use this variable value as a value for the get variable for your second server action (for the grid)
  • In the left column, select the repeated element > dynamic events > on click > set variable value and set the ID as a var value.
    As soon as you click an element in the left column, the variable value changes and it filters the server action for the grid elements.
1 Like

On the left column, there is no repeat element. It is a regular 'select' html element.
The click option needs to be set for each "option" item inside the 'select' element. But with the dynamic event click event, actual selection click event is not happenning.
So, if I click it two-three times, it eventually works, but that's of no use.

Also, there is no way to set the first item as selected for the 'select' element in UI.

So you are using a dropdown/select menu which has static values, is that right?

no, the select element has dynamic values - which is binded using server connect DB query - and is showing correct values on page load.

Then you don’t need the variable on the page. Just set the select value as a value for the second server action filter.

The logic is the same as here Filtering Database Query with a Text Input but instead of using a text field you bind the select value for the filter and in the query builder you use “equal” instead of “contains” …

1 Like

Yes, the variable part I figured out. But the issue here is that on selecting an ‘option’ item inside the ‘select’ element, the click event is not fired.
If I click the already selected option again, then the event is fired and data is generated.
This is because the event which I need to bind with is ‘selected/change’ event and not the ‘click’ event.

I tried using the ‘change’ event in dynamic attribute, but its broken too.

You don’t need to apply any event on the select. Please remove any if added. You do not need the variable on the page as well.

Please check the link i sent you - it shows how to filter a query with a text field but it is the same except you are using a select and the condition should be “equal” instead of “contains”

1 Like

Got it. No need for dynamic events.
Its working now.

1 Like

One more issue left. On page load, there is no item selected by default, so the right side is blank. How to set first item as selected.

Please provide your select field code here.

<select size="16" id="listCabinet" name="listCabinet" style="width:90%" dmx-bind:options="" optiontext="Cabinet" optionvalue="Cabinet" data-msg-required=""></select>

@Teodor - requesting for an update please.

In the selected value in the UI - select your server connect > data > query > binding which should generate an expression like:[0].category which is the first value in the query.

If you remove the “size” attribute from the select then the first record will be automatically selected.

1 Like

wouldn't want to do this coz we want a select list not a dropdown.

this works just fine. thank you.

1 Like

I am not saying you should remove it, just explaining how it works for a dropdown :slight_smile:

1 Like