Problem with multiple grids on a page sharing a ClientDetailTemplate

2 posts, 0 answers
  1. James
    James avatar
    17 posts
    Member since:
    Sep 2014

    Posted 25 Jun Link to this post

    A part of our ASP.NET MVC app consists of a tabstrip with a grid in each tab.  Each grid also has a .ClientDetailTemplateId("grid-details-form") and each grid shares the partial that makes up the clientTemplate @{ Html.RenderPartial("_DiagnosisRecordComments"); }    _DiagnosisRecordComments has <script id="grid-details-form" type="text/x-kendo-template">

     

    Here's 3 pictures to demonstrate the problem as we navigate the tabs, their grids, and the client templates.  First tab, its grid and first row client template expanded out.   All is good with the editor in the client template.  Then we go to the second tab grid, first row client template and we a raw TextArea.  Go back to the first tab grid, and now we have an editor within an editor.

    Obviously Kendo is getting confused about where to render the Edtior.   So right now the editor is declared via razor.

     

    @(Html.Kendo().Editor()
      .Name("validation-editor")
      .HtmlAttributes(new { style = "height:160px;" })
      .Tools(tools => tools
                          .Clear()
                          .Bold()
                          .Italic()
                          .Underline()
                          .Strikethrough()
                          .FontColor()
                          .JustifyLeft()
                          .JustifyCenter()
                          .JustifyRight()
                          .Indent()
                          .InsertUnorderedList()
                          .InsertOrderedList()).ToClientTemplate())

     

     

    I'm thinking that I'm going to have create the editor dynamically on each tab navigation.  Any idea what's going on?  

     

     

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 28 Jun Link to this post

    Hello James,

    Most probably the reason for this behavior is because the Kendo UI Editor for ASP.NET MVC has a static name. 

    .Name("validation-editor")

    As far as you know the Kendo UI widgets should be initialized from elements with unique id. When user goes to the next tab it will create a text area with the same id value. 

    Please refer to the Grid / Hierarchy demo and note that the Name for the child grid includes the parent row id in order to make the Name value unique. 

    Regards,
    Boyan Dimitrov
    Telerik
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
Back to Top