如何将行的模型从Kendo Grid传递到可编辑的模板

时间:2014-04-22 22:30:32

标签: asp.net-mvc razor kendo-grid

我有一个Kendo Grid,它有一个弹出式可编辑模板, 如果可能的话,我想将模型(行的模型,或者至少它的Id)传递给可编辑的模板

网格

@(Html.Kendo().Grid<Client>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Name).Width(140);
        columns.Bound(c => c.Status);
        columns.Bound(c => c.ProcesingStyle);
        columns.Bound(c => c.ArchiveDays);
        columns.Command(command =>
        {
            command.Edit().Text(" ");
            command.Destroy().Text(" "); ;
        }).Width(90);

    })
     .ToolBar(toolbar => toolbar.Create().Text("New"))
     .Editable(editable => editable
        .Mode(GridEditMode.PopUp)
        .TemplateName("Client").AdditionalViewData(new { Client = Model })
        .Window(w => w.Title("Site")))
    .HtmlAttributes(new { style = "height: 380px;" })
    .Scrollable()
    .Sortable()
    .Selectable()
    .Resizable(resize => resize.Columns(true))
    .Reorderable(reorder => reorder.Columns(true))
    .Events(events => events.Change("onChange"))
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(5))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Get", "Clients"))
        .Model(model => model.Id(p => p.Id))
                .Create(update => update.Action("Create", "Clients"))
                .Update(update => update.Action("Update", "Clients"))
                .Destroy(update => update.Action("Destroy", "Clients"))
    )
)

模板

@model Client
@(Html.Kendo().ComboBoxFor(m => m.Plan)
    .DataTextField("Name")
    .DataValueField("Id")
    .Placeholder("Select Plan...")
    .HtmlAttributes(new { style = "width:300px" })
    .Filter(FilterType.Contains)
    .MinLength(3)
    .DataSource(source => 
        source.Read(read => 
            read.Action("GetPlans", "Plans",new {ClientId = Model.Id}))))

一切正常,除了我需要在模板中使用行/模型的Id,特别是,我需要将model.Id(行的模型的id)传递给动作在模板中的Combobox上,我可以正确过滤数据

这是网格中的违规行

.TemplateName("Client").AdditionalViewData(new { Client = Model })

结果是模板里面的模型总是为null,我不知道如何将我需要的数据传递给模板

无论如何我能做到这一点,还是我应该看一个不同的方法?

2 个答案:

答案 0 :(得分:3)

我解决这个问题的方法是在原始视图中放置一个javascript函数,如下所示

function getClientId() {
    var row = $(event.srcElement).closest("tr");
    var grid = $(event.srcElement).closest("[data-role=grid]").data("kendoGrid");
    var dataItem = grid.dataItem(row);  
    if (dataItem)
        return { clientId: dataItem.Id }
    else
        return { clientId: null }
    }

从我的编辑模板中引用它

.DataSource(source => source.Read(read => read.Action("GetPlans", "Plans").Data("getClientId"))))

注意:我很确定你无法从EditorTemplate运行javascript,因此需要将其存放在原始视图中

如果其他人可以更好地回答这个问题,或者有不同的答案,则会相应地标记答案

答案 1 :(得分:0)

我知道这是一个非常老的问题,但是对于那些想知道为什么这行不通的人:

.TemplateName("Client").AdditionalViewData(new { Client = Model })

此代码不起作用,因为您可以通过此方法传递的唯一数据是静态数据。您可以传递特定的字符串或数字,例如“ Hello World”,这样就可以正常工作。对于使用Kendo的动态数据,我了解到它确实取决于情况,并且您的解决方案在这里效果很好。