I have a grid where first 2 columns are bound with ForeignKey (Category and Product). The value of the first dropdown dictates the value of the second. How can I reload the values of the second dropdown after the first dropdown value changes?
@(Html.Telerik().Grid<Order>().HtmlAttributes(new { style = "width: 700px" })
.Name("grdOrders")
.ToolBar(tb => tb.Insert())
.DataBinding(binding => binding.Ajax()
.Select("GetOrders", "Home")
.Update("UpdateOrder", "Home")
.Insert("InsertOrder", "Home")
.Delete("DeleteOrder", "Home"))
.DataKeys(keys => keys.Add(o => o.OrderID))
.Columns(cols =>
{
cols.Bound(c => c.OrderID).Width(100).ReadOnly();
cols.Bound(c => c.Name);
cols.ForeignKey(c => c.ItemCategoryID, (System.Collections.IEnumerable)ViewData["Categories"],
"ItemCategoryID", "CategoryName").Title("dbCategory").Width(300);
cols.ForeignKey(c => c.ItemID, (System.Collections.IEnumerable)ViewData["dbItems"],
"ItemID", "ItemName").Width(200).Title("Item");
cols.Command(cmd =>
{
cmd.Edit().ButtonType(GridButtonType.Image);
cmd.Delete().ButtonType(GridButtonType.Image);
}).Title("Commands").Width(100);
})