Multi-Column Dropdown

Hi,
I would like to show the result of "column1+column2" in the TextProperty of a DropDown element. How could this achieved?
Regards
Ralf

This can be achieved by transforming the original data to have a property which is the result of "column1 + column2".

Here is how this can be done:

  1. Create a page property which will contain the DropDown options:
  2. Configure the DropDown - set its Data, TextProperty and ValueProperty:
  3. Invoke a data source method which retrieves the options from the database. In its Then event set the options property by mapping over the result:

Here is the code which sets the value:

${result.value}.map(p => {
   return {   
      text: p.ProductName + ' ' + p.Id,
      value: p.Id
   };
});

In this example the text will be the concatenation of the ProductName and Id properties.

Here is a runnable application which you can import in Radzen: multi-column-dropdown.zip

1 Like

Hi,
thank you for the solution but this is very complicated for this simple task. I think it is easier to create a view and concat the columns in sql.
Regards
Ralf