Multiple Editors not Rendering Correctly

[James]

This is somewhat of a crosspost from over on the Template area, but its probably more of an Editor issue than a client template issue.

Here's our issue for our ASP.NET MVC application.   We have a tabstrip and a grid in each tab of the tabstrip.  We also have a clientDetailTemplateId for each grid that points to a partial that contains the element id that ClientDetailTemplateId needs. Note that the partial is shared between all grids.

I'm posting 3 images to show what's going on.

FirstTabFirstRecordEditorGood.png shows first tab, expanding the detail of the first row eveything looks good

SecondTabFirstRecordOnlyRawTextArea.png shows going to the second tab, expanding detail of the first row and we only see a raw TextArea

GoBackToFirstTabEditorWithinEditor.png show going back to first tab, first grid, first row and you can see that there's an Editor within an Editor

Now, I think I have an idea of what's going on.  Each Editor name/id is unique based on a unique id per row.   Each grid row is unique, but another grid can have the same record id that would make up the name/id of the editor.

Now the obvious answer would be to give each editor a unique name.  That's actually easier said than done because of the fact that each grid shares the same partial that acts as the clientDetailTemlate.

My current idea is to create the editors dynamically on tab select.   I can append the tab index to the editor name and then it will be unique.  To me, that's not ideal, so I thought I would see if there's an alternative.

I know there's actually two ways that an Editor is implemented.  The IFrame way and another way.  I'm not sure if going the alternative way would help out.

 

Thanks

 

[Niko]

Hello James,

It appears that the Kendo Editor has been initialized twice, which could lead to the behavior in the last screenshot - http://docs.telerik.com/kendo-ui/intro/installation/jquery-initialization#duplicate-initialization. Your observations appear to be right, having two textareas with the same ID on the page would lead to initializing the editor on the first tag twice. Querying of the element by ID would not return the second tag as can be seen in your second screenshot. 

Making IDs really unique is the way to go. You could check the following discussion on StackOverflow - http://stackoverflow.com/questions/18672184/eliminating-duplicate-id-in-partial-view-mvc-3-razor.

Hope this helps.

Regards,
Niko
Telerik