Kendo treeview and custom nodes

Question

I have some customized tree-nodes;

so the regular node functionalities of treeview won't work (append, remove, etc...)

So I'm using jQuery to add, rename, remove a node;

it's all good, except, for when I'm adding a new node; I use jQuery to clone a node and add the new node to the treeview (I update all the customized attributes of the node);

The problem:

the uid of the newly cloned node is the same as the cloned node; I tried appending a "1" to the new uid but it causes error to be thrown left and right; I know the uid is a GUID, but is there more to it? are there some wierd behind the scene logics that prevents me from changing the uid of the node?

Here's the sample javascript (this is after the ajax call to the server is made and database is updated; I don't want to refresh the entire tree; rather I just wanna add the node to the tree on the javascript side):

function AddNew(newlyAddedJob)
{
    var newJobId = newlyAddedJob.JobId;
    var parentJobId = newlyAddedJob.ParentJobId;
    var newJobIdCrums = newlyAddedJob.JobIdCrums;
    var parentJobIdCrums = newJobIdCrums.substring(0, newJobIdCrums.indexOf(parentJobId) + parentJobId.toString().length);

    var trv = $("#" + trvMonitorListId).data("kendoTreeView");

    var jParent = "#" + trvMonitorListId + "> * li[data-jobidcrums='" + parentJobIdCrums + "']";
    var jSibiling = "#" + trvMonitorListId + "> * li[data-jobidcrums='" + parentJobIdCrums + "']> ul > li";
    var jSelector = jSibiling;
    if ($(jSibiling).length < 1)
    {
        jSelector = jParent;
    }


    var newUId = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c)
    {
        var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
        return v.toString(16);
    });
    var aNode = $(jSelector)[0];
    var newNode = $(aNode).clone();
    var origUid = $(jSelector).attr("data-uid");
    newNode.attr("id", newJobId);
    newNode.attr("data-jobId", newJobId);
    newNode.attr("data-parentJobId", parentJobId);
    newNode.attr("data-jobIdCrums", newlyAddedJob.JobIdCrums);
    newNode.attr("data-uid", newUId);
    $(jParent).append(newNode);
    var jNewNodeSelector = "#" + trvMonitorListId + "> * li[data-jobidcrums='" + newlyAddedJob.JobIdCrums + "'] > div > * a";
    $(jNewNodeSelector)[0].innerText = "Stuff and more ...";

    $(jSelector + " * span.k-in.k-state-selected").toggleClass("k-in k-state-selected", "k-in");

    //var domText = $(jselector + "di");

    trv = $("#" + trvMonitorListId).data("kendoTreeView");
    trv.select(newNode);
    GetMonitorDetails(newJobId, parentJobId);
}

Nic Nic · Accepted Answer · 2014-10-29T00:48:45

What errors do you get? Any source code you can post?

Perhaps you should just generate a new random guid, rather than basing it off the current one.

Kendo treeview and custom nodes

1 Answers