ClientTemplate column doesn't work when grid is ClientDetailTemplate

2 posts, 0 answers
  1. CONTENTShare
    CONTENTShare avatar
    6 posts
    Member since:
    Jun 2013

    Posted 22 Feb 2017 Link to this post

    Hello,

    we use Kendo MVC Grid to display some documents. We have column for actions on document with dropdown of actions. Code of the column looks like this:

    columns.Bound(p => p.ID).ClientTemplate(Html.Kendo().DropDownList().DataTextField("Text")
                .Events(e => e.Change("actionsDDLChange").Open("actionsDDLDataBound"))
                .HtmlAttributes(new { docID = "\\#=ID\\#", @lock = "\\#=Lock\\#", documentName = "\\#=DocumentName\\#", lockedBy = "\\#=ChangedBy\\#" })
                .DataValueField("Value").Name("ddl\\#=ID\\#").BindTo(ViewBag.DocActionsDDL)
                .ToClientTemplate().ToString()).Title("Actions").HtmlAttributes(new { @class = "templateCell" }).Sortable(false).Filterable(false);

     

    Everything works fine in normal Grid. Then we tried to use the same code to be ClientDetailTemplate of another Grid and it doesn't work. We had to change this column to be like:

    columns.Bound(p => p.ID).ClientTemplate("<button class=\"k-button\" >Download</button>"

    This is just part of new code with buttons for other actions following. In other words, we had to lose .DropDownList approach. We get "Script error" in appgui.js if we try dropdown approach.

    Is there a way to make this work with .DropDownList as tempalte for column, because we want this grid to look the same? We will probably want to reuse it as ClientDetailTemplate in other grids as well, or have Tab control as ClientDetailTemplate with this grid for documents in one of tabs, so we would use it as partial view. But we want to solve this problem first and we are out of ideas.

     

  2. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2466 posts

    Posted 24 Feb 2017 Link to this post

    Hi Nikola,

    When the DetailTemplate is initialized the script for initializing the DropDownList will also be triggered, but it will contain escaping symbols in its properties, which will break the initialization. I would recommend that you place an input element in the template and initialize the DropDownList manually when the nested Grid is rendered.

    A better solution would be to place the DropDownList in the EditorTemplate for that column and not in the ClientTemplate, because the ClientTemplate is not designed to be used for editors.


    Best Regards,
    Konstantin Dikov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top