[Solved] MVC Kendo Grid - Editable Template not binding

[Tim]

I have a Kendo Grid that works fine if I use the built in popup editor, .Editable(editable => editable.Mode(GridEditMode.PopUp))                

If I switch to a custom template it won't bind the data. 

Any help is appreciated.

@(Html.Kendo().Grid<Application.Models.OrgHtmlContentViewModel>()
    .Name("ContentGrid")
    .Columns(columns =>
    {
        columns.Bound(c => c.OrgHtmlContentTypeName).Width(150).Title("Content Type");
        columns.Bound(c => c.HtmlContent).Width(600).Title("Html Content").Encoded(false);
        columns.Command(command => { command.Edit(); }).Width(100);
    })
    .HtmlAttributes(new { style = "height: 600px;" })
    .Scrollable()
    .Sortable()
    //.Editable(editable => editable.Mode(GridEditMode.PopUp))
    .Editable(editable => { editable.Mode(GridEditMode.PopUp); editable.TemplateName("OrgHtmlContentEditor").Window(w => w.Title("Org Html Content").Width(760)); })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Events(events => events.Error("error_handler"))
        .Model(model => model.Id(c => c.OrgHtmlContentId))
        .Read(read => read.Action("OrgHtmlContent_Read", "OrgHtmlContents", new { id = Model.OrganizationId }))
        .Update(update => update.Action("OrgHtmlContent_Update", "OrgHtmlContents"))
    )
)

Custom Editor

@model Application.Models.OrgHtmlContentViewModel

<div style="padding: 10px;">
   <h6>@Html.DisplayFor(m => m.OrgHtmlContentTypeName)</h6>

    @(Html.Kendo().EditorFor(c => c.HtmlContent)
          .Name("contentEditor")
          .HtmlAttributes(new { style = "width: 740px;height:440px" })
    )
</div>

[Alexander Popov]

Hi Tim,

This happens because the widget uses a name different from the field it's bound to:

@(Html.Kendo().EditorFor(c => c.HtmlContent)
      .Name("contentEditor") //this would create a value binding to a field named contentEditor, however there is not such field in the current context
      .HtmlAttributes(new { style = "width: 740px;height:440px" })
)

Basically, the For helpers automatically assign a name, so doing this manually is rarely needed. 

Regards,
Alexander Popov
Telerik