How do I override the Telerik MVC Grid editor popup when using ClientTemplates and AjaxBinding

D.Forrest picture D.Forrest · Sep 26, 2011 · Viewed 8.3k times · Source

I've got a list of user roles that I'm trying to display in my grid column and trying to set up a custom template for in the edit pop-up.

I tried taking the tac of using the display/editor templates but found out that ajax binding doesn't support these (As the model is always null). So the fix for the column side is using .ClientTemplate on the column in question... which works in the following simplified example of my table...

@( Html.Telerik().Grid<UserSearchModel>()
    .Name("Grid")
    .DataKeys(keys => { keys.Add(p => p.UserId); })
    .Columns(columns =>
           {
               columns.Bound(o => o.UserId).Visible(false) ;
               if(Context.User.IsInRole("Admin")) columns.Bound(o=>o.CompanyName).Width(100);
               columns.Bound(o => o.RolesModel).ClientTemplate("<strong><#= RolesModel.RoleName #></strong>");
               columns.Command(commands =>
               {
                   commands.Edit().ButtonType(type);
               }).Width(180).Title("Commands");       
           })
    .DataBinding(dataBinding => dataBinding.Ajax()
                   .Select("_AjaxBinding", "Users")
                           .Update("Edit", "Users")
                               .Insert("Create", "Users")
                 )
    .Resizable(resizing => resizing.Columns(true))
    .Reorderable(reorder => reorder.Columns(true))
    .Editable(editable => editable.Mode(GridEditMode.PopUp))
    .Pageable(p=> p.PageSize(13))
    .Sortable()
    .Scrollable(scrolling => scrolling.Height("400px"))
    .Groupable()
    .Filterable()

)

But that doesn't pass over to the edit popup... so my question is how do I manage to override the popup to show a custom display for the column I've assigned the .ClientTemplate to?

I've tried using the WindowBuilder (.Window(w=>w.Content("...content stuff here...")) to no avail. The default edit window pops up each time.

Answer

George K picture George K · Sep 27, 2011

For more information about editing of nested objects in ASP.NET MVC I will suggest you check this blog post.

Maybe this help topic will help too.

You can also specify partial view, which can be used as editor form:

.Editable(editing => editing.TemplateName("TemplateName"))