Have an Edit form TextBox populated from 2 levels deep

Hi, a newbie here.

I am looking at purchasing Radzen for inhouse development and love what I see so far.
Currently building a small trial app and would like a pointer how to achieve the following.

I building a small trial app. but am stuck.

DB Postgres with the following 3 tables

Address (Table/Entity)
City_ID (FK)

City (Table/Entity)
Id (PK)
Country_Id (FK)

Country (Table/Entity)
Id (PK)

I am fine with setting up a DataGrid to display Address, with City.Name and Country.Name through the relations, but am having problems with Edit and Add Forms.

On Edit or Add Address Forms, I would like to use a dropdown to select City which will automatically provide Country through the City.Country_Id(FK) relationship and display Country.Name in a TextBox. I have read and tried everything I can find but with no success.

Any guidance would be appreciated.

Many thanks.

Hi @Algimantas_Gasiunas,

If your tables have foreign key constraints Radzen will create dropdowns automatically.

Hi Korchev

Thanks for the quick reply.

I am good with setting up the dropdown, my problem is trying to populate a TextBox with Country.Name from the Edit or Add Address form. We would like to select City from the dropdown which then populates the Country TextBox (Read Only) with the value Address.City.Country.Name.

Many thanks.

Check using the debugger. You should have Country property for every City item. If the Country is null you can add it to $expand parameter for the method used to populate cities.

Thanks Enchev.

Using the debugger, Country is a null under City.
This I suspected is where I have been going wrong but am lost in trying to fix it, have spend hours on it.

These screen shots may help to guide me in the right direction.

In the page load event for EditAddress I have:

and have tried using ${address.City.Country.Name} as the Value for the TextBox.

As you can see this is causing a Null Exception.

What am I doing wrong?
Any help will be greatly appreciated. I come from a C++ and Delphi background, so could easily be making some big blunders.

Again many thanks

Try to change the expression to:

Try also to populate City.Country for address by adding this to $expand for getAddressById:

Again thanks for the fast reply.

Changing the expression to:
${address?.City?.Country?.Name} results in a code generation error as below

I tried previously to add $expand under the getAddressById but do not have the option to select Expand

Can I add it another way?

Again big thanks for your help.

Hi @Algimantas_Gasiunas,

I was wrong about the $expand parameter, sorry! It is supported in Angular applications only at the moment for GetByXXX methods. I will try to find a way to execute complex expand to handle such scenarios and I’ll post here more info.

Thank you Enchev.

Look forward to your post, as this has been sending me crazy for the last few days.

I choose to go with Blazor components rather than Angular, should I reconsider?
Blazor appears to be the better direction to go in, to me it looks like the next generation.

Although Blazor is relatively new it is much easier compared to Angular.

Your scenario is similar to Northwind OrderDetails -> Products - > Suppliers. Here is what you can do:

I've added Change event for the Product DropDown in Add Order Details page to execute the following code:

orderdetail.Product = getProductsResult.FirstOrDefault(p => p.ProductID == ${event})

I've added also additional row to the form with read-only TextBox component to show the City of the product supplier for this order detail:

The supplier city TextBox Value expression is @orderdetail?.Product?.Supplier?.City - this will tell Radzen to generate simple expression isntead ${} which will generate bind-Value expression.

The result:

Hi Enchev.

That was a big help thank you.

I now have this working for Add Address, but still have the question of how to make it work for edit. In Edit, the Change event allows to keep the "Country Name" text box in sync with any changes to City from the dropdown, but I am still not sure how to have the "Country Name" text box populated on loading.

Again many thanks for the fast response.

For Edit page the approach will be almost the same. Instead only Change of the DropDown you will need to add similar code (orderdetail.Product = getProductsResult.FirstOrDefault(p => p.ProductID == ${orderdetail.ProductID})) to Page Load after you get the lookup collection:

Hi Enchev

Again a big thank you, I now have both Add and Edit are working correctly.
Will expand the test app some more to try other features, but I am certainly impressed with your product and service.

Thank you.
Stay safe.