Kendo Grid Foreign key column bind dynamically

Question

@(Html.Kendo().Grid((IEnumerable)Model.contact_lst)  
    .Name(\"grid\")
    .Columns(columns =>
    {

        columns         


        

Answer 1

Kendo grid does not support dynamic rebinding. The closest thing you can get is to define a custom Editor Template which binds data using AJAX.

columns.ForeignKey(p => p.CPOID, 
(System.Collections.IEnumerable)ViewData["CPOs"], "cpo_id", "contract_po")
.Title("Company - Contact/Purchase Order")
.EditorTemplateName("RemoteForeignKey");

RemoteForeignKey Editor Template

@model int

@(Html.Kendo().DropDownListFor(m => m)
  .DataSource(source =>
  {
      source.Read(read =>
      {
          read.Action("actionName", "controllerName").Type(HttpVerbs.Post).Data("dataFunc");
      }).ServerFiltering(false);
  })
  .DataValueField("cpo_id")
  .DataTextField("contract_po")
)

dataFunc javascript function

function dataFunc () {
    return {
        SiteID: $("#SiteID").val() // here we pass the site ID to server
    };
}

and your server function

[AcceptVerbs(HttpVerbs.Post)]
public JsonResult actionName(int? SiteID)
{
    if (SiteID != null)
    {
        var objects = (from obj in db.tableName
                       where obj.SiteID == SiteID.Value
                       select new
                       {
                           cpo_id = obj.cpo_id,
                           contract_po = obj.contract_po
                       }).ToList().Distinct().OrderBy(obj => obj.contract_po);
            return Json(objects);
    }
    return null;
}

Then the values in your dropdown will be filtered by the current value of SiteID input.