We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Inline editing of grid - populate dropdown values from remote (AJAX) source

I have data grid component and i am using it with 'inline editing' mode. Value of one column is being selected from dropdown control. Value that is provided is string (more precise: Guid) and dropdown options are in form of Text (human friendly text) / Value (string ~ guid).

When i have small amount of options to provide to dropdown control, it works OK. That means when grid is created, that column has right text displayed (it matches value and text/value from dropdown options), and editing works fine.

However, this dropdown has many options, 10K+ records so i used remote (ajax) source for that. Now the problem that i have is that grid doesn't show value because it's a remote call and it doesn't fetch proper Text/Value to connect it to value. So it doesn't show any value (more precise: text) to user.

How to achieve this?

5 Replies

RR Rajapandi Ravi Syncfusion Team October 27, 2022 07:54 AM

Hi Kresimir,

Greetings from Syncfusion support

Before we start providing solution to your query, please share the below details that will be helpful for us to provide better solution.

1)             Share your complete Grid rendering code, we would like to check how you are binding the remote date to the inline edit dropdown

2)             Share your Syncfusion package version.

3)             Share the issue scenario in video demonstration format.


Rajapandi R

KR Kresimir October 28, 2022 03:34 AM

hello, i've made sample and attached it...

I've included comments in code, but have in mind the follwing:

index.cshtml contains three examples:

  1. dropdown OK
  2. multiselect NOT OK (LINK to another separate issue - i included it here because it's easier to have it in same project and it's very similar issue)
  3. grid NOT OK (this is problem that i am asking in this issue)

Attachment: Syncfusion_178454_8dfe83d6.zip

RR Rajapandi Ravi Syncfusion Team October 31, 2022 09:26 AM

Hi Kresimir,

Thanks for your update

Based on your shared information we have checked your sample and we could see that the dropdown was displays the respective datasource as text based on id. Please refer the below video demo.

Video demo: https://www.syncfusion.com/downloads/support/directtrac/general/ze/vddropgrid-1404104028.zip

Please share the details about your problem scenario with detailed description about Grid. Share the issue replication procedure step by step and also share the issue scenario in video demonstration.


Rajapandi R

KR Kresimir November 1, 2022 04:45 AM


actually i need the value to be shown in the grid BEFORE doing inline edit that shows dialog.

I've attached modified example with slightly different solution to the problem - so that grid receives text that should be shown. That works ok, but now i have another issue, when i update value with another option, it just doesn't work as expected.

Attachment: Syncfusion_178454_2_259e6025.zip

RR Rajapandi Ravi Syncfusion Team November 3, 2022 09:46 AM

Hi Kresimir,

We have checked your query and we could see that you are having only two datasource and bind the template value as DropdownItemText to the DropdownItemId column. So, when you edit the 1st record and for example you are selecting the “Wilkerson Hanson” value from the dropdown and saving the record, now it will display the “Wilkerson Hanson” in the Grid it will always displays “Guerra Johnson”, because you are using template property and bind the DropdownItemText value, so it will display the “Guerra Johnson” for the 1st record and “Nicholson Gill” for second record whenever you are updating the record. It was the default behavior.

From checking your requirement, we could see that you can achieve your requirement by using our Foreignkey column feature. The Foreign key column can be enabled by using dataSource, foreignKeyField and foreignKeyValue properties of e-grid-column tag helper. Please refer the below documentation for more information.

Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/columns/foreign-key-column


Rajapandi R

Live Chat Icon For mobile
Up arrow icon