Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Cascading Combo Boxes

New
Customer Name 
Country 
City 
EditMaria AndersFaroe IslandsTorshavn
EditThomas HardyAustriaEisenstadt
EditYang WangBermudaHamilton
UpdateCancel
v
v
EditSven OttliebUzbekistanMarghilon
EditJanine LabruneVietnamHanoi
EditMartine RanceHoly SeeVatican City
EditMaria LarssonVirgin IslandsCharlotte Amalie
EditPeter FrankenYemenAden
EditCarlos HernandezAmerican SamoaPago Pago
Page 1 of 2 (14 items)Prev12Next


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.