How to rebind dropdownedit after insert or delete?

[Scott]

I have a view with three grids, each bound to different controllers.  Each grid uses an edit dialog and each has a  dropdownedit control that is bound:

One of the grids allows the user to either add or remove people and the binding on that grid is working well, meaning that the grid updates when a person is added or removed.  However, despite updating the associated ViewBag.People during the CRUD operation, the other grids dropdownedit controls do not receive the update, meaning that if I insert a new person, those controls do not show the new person until the page is reloaded and if I remove a person, the same thing:

So, how exactly do I "refresh" the "PeopleDropDownSource" when a person is added or removed?

Thank you in advance.

[Pavithra Subramaniyam]

Hi Scott,

From your update, we suspect that you are setting ViewBag values to the DropDownList components which will act like local data. So, the changes in the server database will not affect the local data until you refresh the pages. So, we suggest the remote data binding the UrlAdaptor for the DropDownList also just like the Grid component. If this doesn’t meet your requirement, please share the below details which will be helpful for us to provide a better solution as early as possible.

1. Share the code for all three Grid and DropDownList components.
2. Share an issue-reproducible sample that will be easier to validate.

Regards,

Pavithra S

[Scott]

Do you have example code on how to bind the dropdownedit directly to a UrlAdaptor? I have been looking on the forum and on Google but not really finding much specific to my situation.  I see examples on how to do so with a stand alone DropDownList control but I guess I am struggling to carry those examples over to the dropdownedit.

[Pavithra Subramaniyam]

Hi Scott,

Please refer to the below code example for setting remote data to the DropDownList edit params.

@{

        var DropDownList = new Syncfusion.EJ2.DropDowns.DropDownList() {

            DataSource = new Syncfusion.EJ2.DataManager() { Url="Home/UrlDataSource",Adaptor="UrlAdaptor"},

            Query = "new ej.data.Query()",

            Fields = new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings() { Value = "Country", Text = "Country" },

            AllowFiltering = true,

        };

    }

Please get back to us if you need further assistance on this.

Regards,

Pavithra S

[Scott]

Wow was I overthinking this.  That works perfectly and I certainly should have figured that out on my own, but I truly appreciate your assistance Pavithra, thank you.

[Scott]

Pavithra, I do have another question around the same area, hopefully it's not as dumb as my last one.

Now that my DropDownList is populated and updated correctly, when someone goes to add a new asset, they must select a current person from the list (AccountOwner).  AccountOwner is the dropdownlist you already helped me with and the binding comes from here:

So, once someone selects a person/AccountOwner in that dropdown when adding a new asset, I need to set the "Term" column value to the "Term" on the selected person/AccountOwner, which exists in the "PersonDataSource" but not in the "AssetDataSou.  The "Term" is already part of the dataset returned in the "PersonDataSource" but obviously the PeopleDropDownSource is specific to a dropdown control and also filtered for a single "Name" property.

Any insight you can provide is appreciated, thank you in advance.

[Pavithra Subramaniyam]

Scott,

From your update, we understood that you want to make changes while selecting a value in the Person DropDownList. If yes, you can achieve your requirement by adding the “change” or “select” event to the DropDownList which will be triggered while changing/selecting a value. Please refer to the below code example and API link for more information.

@{

        var DropDownList = new Syncfusion.EJ2.DropDowns.DropDownList() {

                                        .   .  .

                                 Change= “change”

        };

    }

 

<script>

  function change(args){

    console.log(args);

  }

</script>

 

https://ej2.syncfusion.com/javascript/documentation/api/drop-down-list/#change

https://ej2.syncfusion.com/javascript/documentation/api/drop-down-list/#select

If the above doesn't work or you want to perform more actions please share a working sample to understand the environment and a video demo of your requirements which will be helpful for us to provide a better solution.

[Scott]

Pavithra,

Yet again, thank you.  You are always very helpful, and I truly appreciate it.  I am leaving these screenshots in case they help someone else as slow as me in the future, not sure if this is the best way but it seems to be working perfect.  Please consider this issue closed and thank you again.

[Suganya Gopinath]

Hi Scott, 

We are glad that the issue is been resolved. Please get back to us for further assistance. 

We are marking this thread as solved.