Kendo UI Grid with Cascading DropDownList

Here is what I've done for GridEditMode.InCell. I have Client and Fund, each client have own list of Funds, so when user select client I need to only show Funds specific to this client

View: Kendo Grid UI setup

    c.ForeignKey(p => p.ClientId, Model.Clients, "Id", "ClientName")
      .Title("Client")
      .Width(100);
    c.ForeignKey(p => p.FundId, Model.Funds, "Id", "Description")
      .EditorViewData(new {funds = Model.Funds})
      .EditorTemplateName("FundForeignKeyEditor")
      .Title("Fund")
      .Width(100);
   })
   .Editable(x => x.Mode(GridEditMode.InCell))
   .Events(e => e.Edit("gridEdit"))

Now when user click on Fund you need to perform filtering of the datasource for funds, you do it on "gridEdit" event using JavaScript. You put this code in the same view/file as your code above

<script type="text/javascript">
    function gridEdit(e) {
        var fundDropDown = e.container.find("#FundId").data("kendoDropDownList");

        if (fundDropDown) {
            fundDropDown.dataSource.filter({ field: "ClientId", operator: "eq", value: e.model.ClientId });

</script>

Fund has "FundForeighKeyEditor" editor template, which you have to add in to Views\Shares\EditorTemplate folder. You can use any name, just make sure name of the file template matches name of the EditorTemplateName. In my case I used "FundForeignKeyEditor" as EditorTemplate and FundForeighKeyEditor.cshtml file

FundForeighKeyEditor.cshtml

@model FundViewModel

@(
        Html.Kendo().DropDownListFor(m => m)
            .BindTo((System.Collections.IEnumerable)ViewData["funds"])
            .DataTextField("Description")
            .DataValueField("Id")
)

Here is a FundViewModel, it contains ClientId so I can perform filtering on it

public class FundViewModel
{
    public string Id { get; set; }
    public string ClientId { get; set; }
    public string Description { get; set; }
}

The easiest way would be to use the cascading dropdownlists: http://demos.kendoui.com/web/dropdownlist/cascadingdropdownlist.html inside of the editor templates for each of these columns.

If you are using popup editing you might consider customizing the popup menu like here: http://www.kendoui.com/code-library/mvc/grid/custom-popup-editor.aspx

If you are using InLine editing you should use this approach to customize the editor templates: http://docs.kendoui.com/documentation/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/editor-templates

If you are using InCell - lets just say its not possible.