Change Theme Settings
Change Theme Settings
Show All Themes

Cascading Combo Boxes

Contact Name 
Company Name 
EditGermanyBerlinMaria AndersAlfreds Futterkiste
EditMexicoMéxico D.F.Ana TrujilloAna Trujillo Emparedados y helados
EditMexicoMéxico D.F.Antonio MorenoAntonio Moreno Taquería
EditSwedenLuleåChristina BerglundBerglunds snabbköp
EditGermanyMannheimHanna MoosBlauer See Delikatessen
EditFranceStrasbourgFrédérique CiteauxBlondesddsl père et fils
EditSpainMadridMartín SommerBólido Comidas preparadas
EditFranceMarseilleLaurence LebihanBon app'
EditCanadaTsawassenElizabeth LincolnBottom-Dollar Markets
Page 1 of 10 (91 items)Prev12345678910Next

In this demo, the combo box in the City column (the City combo box) is populated dynamically with city names via callbacks, based on the value selected in the combo box in the Country column (the Country combo box). Only the content stored in the City combo box is updated during round-trips to the server - not the content of the entire view or the DevExpress ASP.NET MVC GridView extension.

To make the City combo box work through callbacks, its settings.CallbackRouteValues property is defined. The property points to a proper Controller ("Editing") and Action ("GetCities") that will handle editor callbacks. In addition, the property defines the TextField text constant whose "CityName" value is passed to the specified Controller Action as a parameter. This parameter identifies a grid column containing the processed City combo box.

The client-side BeginCallback event of the City combo box is handled to identify a country currently selected in the Country combo box. The country identifier is passed to the Controller Action ("GetCities") specified in the CallbackRouteValues property to filter cities by the country.

The Country combo box' client-side SelectedIndexChanged event is handled to initiate a callback to update the City combo box.

On the server side, in the Controller Action ("GetCities"), the grid's GridViewExtension.GetComboBoxCallbackResult method is called to form a proper JSON data result for the City combo box whose callback is processed. The method exposes settings related to a combo box editor's callback mode and a method to bind the editor to its data source dynamically populated based on the currently selected country.