ForeignKey Column
The ForeignKey column functionality of the Telerik UI Grid component for ASP.NET MVC is primarily used for matching the value of a bound property to a desired text field from an external for the grid collection. It follows the convention of the SQL ForeignKey functionality that is used for linking two tables based on a foreign key.
The foreign values for the columns of the grid could be supplied in two ways:
Binding to a Local Collection
Binding the column to a local collection of items can be done by passing a valid IEnumerable collection to the ForeignKey column configuration
columns.ForeignKey(p => p.CategoryID, (System.Collections.IEnumerable)ViewData["categories"], "CategoryID", "CategoryName")
.Title("Category").Width(200);
public class GridController : Controller
{
public ActionResult Index()
{
ViewData["categories"] = GetCategories();
return View();
}
}
public class CategoryViewModel{
public int CategoryID { get; set; }
public string CategoryName { get; set; }
}
Binding to a Remote Collection
In order to bind the column to a remote collection of items, supply a URL Action instead of a static collection. It is mandatory to supply the DataValueField and DataTextField options in order to ensure that the column values will be bound to the correct foreign value.
columns.ForeignKey(p => p.CategoryID, ds=> ds.Read(r => r.Action("Categories", "Grid")), "CategoryID", "CategoryName")
.Title("Category").Width(200);
public class GridController : Controller
{
public ActionResult Categories()
{
IEnumerable<CategoryViewModel> categories;
using (var dataContext = new SampleEntitiesDataContext())
{
categories = dataContext.Categories
.Select(c => new CategoryViewModel
{
CategoryID = c.CategoryID,
CategoryName = c.CategoryName
})
.OrderBy(e => e.CategoryName).ToList();
}
return Json(categories, JsonRequestBehavior.AllowGet);
}
}
public class CategoryViewModel{
public int CategoryID { get; set; }
public string CategoryName { get; set; }
}