在InCell编辑模式下,Kendo UI ASP.Net MVC ForeignKey列DataSource

时间:2013-08-07 14:20:56

标签: kendo-ui kendo-grid

我在页面上有Kendo Grid和ForeignKey列。 ForeignKey列使用ViewData填充,如下所述。

column.ForeignKey(x => x.ProductID, (List<Product>)ViewData["products"], "ID", "ProdName");

网格可以批量(InCell)模式编辑,如下图所示......

.Editable(editable => editable.Mode(GridEditMode.InCell)

我想根据在网格外部定义的其他下拉列表中选择的值,在网页加载后修改网格中的ProductID列集合。

我怎样才能实现这一目标?我可以使用jQuery吗?

我在这里发现的类似例子...... http://www.telerik.com/community/forums/aspnet-mvc/grid/cascading-dropdowns-in-grid-edit---foreignkey-columns.aspx

感谢。

2 个答案:

答案 0 :(得分:5)

我想出了如何使用EditorTemplate为外键列过滤Product下拉列表。

以下是产品的列定义

c.ForeignKey(x => x.ProductID, (List<Product>)ViewData["products"], "ID", "ProdName").EditorTemplateName("ProductIDEditor");

以下是Product,ProductIDEditor.cshtml

编辑器模板
@using Kendo.Mvc.UI

@(Html.Kendo().DropDownListFor(m => m)
    .AutoBind(false)
    .OptionLabel("Select a value...")
    .DataTextField("ProdName")
    .DataValueField("ID")
    .DataSource(dataSource =>
    {
        dataSource.Read(read => read.Action("FilterProducts", "Home").Data("filterProducts"))
        .ServerFiltering(true);
    })                                   
)
@Html.ValidationMessageFor(m => m)

在我的主要 VIEW Index.cshtml中,我添加了filterProducts JavaScript处理程序,它将productID的JSON对象传递给控制器​​。

function filterChargeTypes()
{
    return {
        productID: $("#ProductID").val()
    };
}

以下是侦听过滤事件的控制器 ...

public ActionResult FilterProducts(string productID)
{
    // do your filtereing based on productID.
}
每当用户点击下拉菜单以获取过滤后的值,就会调用<FilterProducts

答案 1 :(得分:0)

您不需要编辑模板。它将绑定到没有它的下拉列表。你可以像使用它一样使用它,只需减去模板:

c.ForeignKey(x => x.ProductID, (List<Product>)ViewData["products"], "ID", "ProdName")

c.ForeignKey(x => x.ProductID, (System.Collections.IEnumerable)ViewData["products"], dataFieldValue: "ID", dataFieldText: "ProdName")

对于过滤,您只需在网格上调用.Filterable()即可。