How to filter dropdowns in a DataGrid?

1

hello, I have a DataGrid, which has 2 dropdowns,
the first dropdown is "Client", and the second is "Contact".

When I select a "Client", it should refresh the "Contact" dropdown, with all the contact values for that Client.

The main table for the DataGrid, has both ClientID and ContactID.

Then the ContactTable has a Foreign Key to the ClientID.

So basically all the Contacts in ContactTable have a ClientID assigned, so when I select from my first Client dropdown, I want to show only the Contacts WHERE ClientID = Dropdown ClientID

currently my Contact dropdown shows all the contacts in the table, and does not filter by the first dropdown value

2

Hi @ava_pmi,

This sounds like cascading dropdowns. In this case you can check this blog post.

3

@korchev thank you for the answer!! Indeed it is, but normally I know how to solve it...

the main problem is, I completely didnt see that the dropdowns you add in a template for each column of a datagrid, have also a change event.........

Now I can simply make the second invoke on the change event in the template and passing the value of the first dropdown...

Can I ask you something else, I'm in the middle of the project, but eventually I will need to change connection, and connect my Radzen app to a different MSSQL server.
This won't create any issue right? As long as the DB structure are the same right? Thank you

4

@korchev ok I almost solved it, now that I saw that you can use the Dropdown Change event in the Template page, I do the Invoke method in the first dropdown while passing the ${event.value} as filter, and all works great, I use the result of this invoke in the second dropdown, and it shows the correct data!

My issue now is, how do I manage this on Load? I mean, when the grid loads, the first and second dropdown will have some values already set, as they come from the DB,
but if you dont change the first dropdown (So you dont trigger the Change event and the invoke), if I open the second dropdown, the data is not filtered based on the first dropdown!
My initial idea was to put another invoke in the Load event of the grid, but then, each row of my data grid will have different values, how can I filter it based on a singel row?

Ideally, my problem would be solved, if the first dropdown has also a onLoad event, so I can do an initial Invoke for the second dropdown

5

Can I ask you something else, I'm in the middle of the project, but eventually I will need to change connection, and connect my Radzen app to a different MSSQL server.
This won't create any issue right? As long as the DB structure are the same right?

Yes, everything should be OK as long as the DB schemas are identical.

Ideally, my problem would be solved, if the first dropdown has also a onLoad event, so I can do an initial Invoke for the second dropdown

The DropDown doesn't have such an event. You can probably use the Then event of the Invoke DataSource method action which populates the dropdown.

6

@korchev it's not a simple dropdown component!

It's a dataGrid (editableGrid), that has 10columns, and when in Edit mode, 2 columns are dropdowns.

So the Invoke DataSource method that populates the dropdown, is the main invoke of the Grid, and it populates everything.

But each row will have its dropdown values, so I cannot use that Invoke on the Grid Load event.

I hope you understand what I mean.

And now I also have another issue, I used the Change event of the first dropdown to do the Invoke filtered by ${event.value} and I save the result in a property: dropdownResult.

Now if I close the template of the first dropdown, and open the template of the second dropdown, and I try to use as Data, the property I set in the previous invoke, "dropdownResult" , it doesnt work, besides being empty the dropdown, I see right away that something is wrong when I start typing and it doesnt suggest the name "dropdownResult".
It's like the Template of the second dropdown doesn't have access to the property declared in the template of the first dropdown...

To make a final summary:
-I have an editable grid
-the grid has 10 columns
-2 columns when in EDIT mode are Dropdowns
-the second dropdown depends on the value of the first.
-I use "Edit Template" to assign those columns as dropdowns in Edit mode.

What I want to achieve is, when the Editable Grid is loaded, and all columns are filled, if I enter in Edit mode, and without touching the value of the first dropdown, I want to see in the second the correct values (filtered by the first dropdown) and if I change the value of the first dropdown, it will update the value of the second dropdown.

I hope it's clear

EDIT: The issue where I don't find the property in the second Template is Solved, I just closed everything and run radzen again, but the first issue stays, how can I load the correct data in the initial load based on the first dropdown value?

7

Can't think of anything at the moment.

8

@korchev I "solved" it... even if I don't like the solution, it's basically a hack.

what I did was, to see the dropdown, you must enter in the EDIT mode of the editable grid,
so to enter EDIT mode what you must do is press the Edit button, and that button has a click event.

So I do the invoke inside the click event, and pass the result to the dropdown before it enters edit mode..

The downside is of course that before when you press EDIT button it was instant, now it takes 0.5sec to enter edit mode