TreeView Javascript Exception 0x800a138f - Unable to get value of the property 'uid'

[Fred]

I am implementing a TreeView within a modal window.  The window works fine the first time it is initialized within its containing razor view.  But whenever the containing razor view is reloaded due to user navigation, I get the attached JavaScript exception within the _attachUids function shown below when the TreeView attempts its ajax call (LoadContentFrom) to my partial view.  Any insight is appreciated as I am still fairly new to the TreeView.

_attachUids:function(t,n){var i,r=this,o=u.attr("uid");t=t||r.root,n=n||r.dataSource,i=n.view(),t.children("li").each(function(t,n){n=e(n).attr(o,i[t].uid),n.attr("role","treeitem"),r._attachUids(n.children("ul"),i[t].children)})}

n=e(n).attr(o,i[t].uid) is the statement that faults with:

t = 0
i[t] = undefined
o = "data-uid"

My Partial View Is:

<script type="text/javascript">
    function onWSBrowseOK() {
        $("#WSBrowseWindow").data("kendoWindow").close();
    }

    function onWSBrowseCancel() {
        $("#WSBrowseWindow").data("kendoWindow").close();
    }

    function getParentWorkspace() {
        var parentId = 0;
        var treeView = $("#WSBrowseTreeView").data("kendoTreeView");
        if (treeView != null) {
            var selNode = treeView.select();
            if (selNode != null) {
                var dataItem = treeView.dataItem(selNode);
                if (dataItem != null) {
                    parentId = dataItem.id;
                }
            }
        }
        return { workspace_id: parentId };
    }

    function onWSBrowseChange(e) {
        var treeView = $("#WSBrowseTreeView").data("kendoTreeView");
        var selNode = treeView.select();
        var fileView = $("#WSBrowseFileTreeView").data("kendoTreeView");
        fileView.dataSource.read();
        e.preventDefault();
    }
</script>

<style>
    #WSBrowseButtons {
        text-align: center;
    }

        #WSBrowseButtons button {
            margin-top: 10px;
            margin-bottom: 10px;
            margin-right: 20px;
        }
</style>

@(Html.Kendo().Splitter()
    .Name("WorkspaceBrowser")
    .Orientation(SplitterOrientation.Horizontal)
    .Panes(vPanes =>
        {
            vPanes.Add()
                .HtmlAttributes(new { id = "WSBrowsePane" })
                .Scrollable(false)
                .Collapsible(false)
                .Resizable(true)
                .Size("50%")
                .Content(
                    Html.Kendo().TreeView()
                        .Name("WSBrowseTreeView")
                        .HtmlAttributes(new { style = "height: 100%; width: 100%;" })
                        .Events(events => events
                            .Change("onWSBrowseChange")
                            )
                        .DataSource(ds => ds
                            .Read(read => read.Action("GetWorkspaces", "Workspace"))
                            )
                        .ToHtmlString()
                );

            vPanes.Add()
                .HtmlAttributes(new { id = "WSFilePane" })
                .Scrollable(false)
                .Collapsible(false)
                .Content(
                    Html.Kendo().TreeView()
                        .Name("WSBrowseFileTreeView")
                        .HtmlAttributes(new { style = "height: 100%; width: 100%;" })
                        .DataSource(ds => ds
                            .Read(read => read.Action("WorkspaceFiles", "Workspace").Data("getParentWorkspace"))
                            )
                        .ToHtmlString()
                );

        })
)
<div id="WSBrowseButtons">
    <button id="WSBrowseOK" onclick="onWSBrowseOK();">OK</button>
    <button id="WSBrowseCancel" onclick="onWSBrowseCancel();">Cancel</button>
</div>

The modal window container is defined as follows:

@(Html.Kendo().Window()

    .Name("WSBrowseWindow")

    .Title("Browse Workspaces")

    .LoadContentFrom("BrowseWorkspaces", "Workspace")

    .Width(600)

    .Resizable()

    .Draggable()

    .Modal(true)

    .Visible(false))

Controller Action Is As Follows.  The query could return zero rows, so I add at least one element to the result.

public JsonResult WorkspaceFiles(string id, string workspace_id)
{
    if (id == null)
        id = workspace_id;

    ISession session = NHibernateHelper.GetCurrentSession();
    List<WorkspaceModels.WorkspaceFilesModel> files = (List<WorkspaceModels.WorkspaceFilesModel>)session.GetNamedQuery("Workspace_GetFiles")
        .SetParameter("pPARENT_ID", id)
        .SetResultTransformer(Transformers.AliasToBean(typeof(WorkspaceModels.WorkspaceFilesModel)))
        .List<WorkspaceModels.WorkspaceFilesModel>();
    NHibernateHelper.CloseSession();

    if (files.Count() == 0)
    {
        WorkspaceModels.WorkspaceFilesModel defaultNode = new WorkspaceModels.WorkspaceFilesModel();
        defaultNode.DOCXID = AppConstants.NULL_GUID;
        defaultNode.DOCXNAME = "No Data";
        defaultNode.HASCHILDREN = 0;
        defaultNode.DOCXPARENTID = null;

        files.Add(defaultNode);
    }

    var fileItems = from e in files
                    where (string.IsNullOrEmpty(id) == false ? e.DOCXPARENTID == id : e.DOCXPARENTID == null)
                    select new
                    {
                        id = e.DOCXID,
                        text = e.DOCXNAME,
                        hasChildren = Convert.ToBoolean(e.HASCHILDREN)
                    };

    return Json(fileItems, JsonRequestBehavior.AllowGet);
}

[Fred]

I forgot to mention that I only included the one controller action as I have found by process of elimination that it is causing the fault.  If I remove the Ajax read to this action, my problem goes away.

[Vladimir Iliev]

Hi Fred,

 
I tried to reproduce the problem locally but to no avail – everything is working as expected on our side. For convenience I created small example of loading treeView from PartialView inside window widget and attached it to the current thread - could you please modify the project to reproduce the issue and send it back to us? This would help us pinpoint the exact reason for this behavior.

Kind Regards,
Vladimir Iliev
Telerik

[Fred]

Vladimir,

Thank you very much for taking your valuable time to try and reproduce my issue.  I was able to resolve my issue by changing the way I created my window.  I removed the MVC wrapper initialization and replaced it with Javascript versions.  Below is the window initialization:

    $("#CreatePOWindow").kendoWindow({
        actions: ["Close"],
        draggable: true,
        modal: true,
        resizable: false,
        title: "Create Process Order",
        visible: false,
        width: 600,
        refresh: function (e) {
            $("#CreatePOWindow").data("kendoWindow").center();
        },
        close: function (e) {
            enableDocxButtons();
        }
    }).data("kendoWindow");

}

I then use a Javascript open function to refresh via Ajax:

function doCreatePO() {
    var grid = $('#DocxGrid').data('kendoGrid');
    var selectedItem = grid.dataItem(grid.select());
    var docxId = selectedItem.DOCXID;
    var isWord = isWordDocument(selectedItem.LINKURL);
    if (isWord) {
        var win = $("#CreatePOWindow").data("kendoWindow");
        if (win != null) {
            win.refresh("@Url.Action("BrowseWorkspaces", "Workspace")");
            win.center();
            win.open();
        }
    }
}

I no longer get the error and everything works as expected.  I will try to reproduce the error in the sample project you provided.