Get selected node databound item id

[Andrei]

I have a treeview build with load on demand from a datasource that is a list of items, every item has an id. I want to send to the server using ajax the id of the selected item in the tree.

--- View code ---
@(Html.Kendo().TreeView()

        .Name("treeview")

        .DataTextField("Name")

        .DataSource(dataSource => dataSource

            .Read(read => read

                .Action("OmanagerItems", "TaskManager")

            )

        )

        .Events(events => events

            .Select("onSelect")

            .Expand("onExpand"))

    )

function onSelect(e) {

    var itemId = e.node.getAttribute("data-uid");

   // this is where i want to get the id of the selected item

}

 

// here i want to tell the server that i'm working on a task

function changeWorkingStatus(docId) {

    $.ajax({

        url: "/TaskManager/ChangeWorkingStatus",

        type: "POST",

        success: function (data) {

            updateInterface(data.IsWorking);

        }

    });

}

I'll appreciate any help, thank you.

[Constantine]

Try this:

var data = $('treeview').data('kendoTreeView').dataItem(e.node);

 

console.log(data.id);

[Andrei]

Thank you! Exactly what I needed!

[Nathan]

This is somewhat close to what I'm trying to accomplish.  I'm trying to create a treeview and when you select a node, it will call an action in the controller.  The screen refreshes with data in a grid.  I just need to figure out how when you select a node, it calls the action in the controller.  This isn't necessarily an ajax call for a view will be return with the appropriate data that was sent in (node Id).

[Tayger]

I am trying to access the selected item or node (I don't care) to set a new text on it. The following both trials run into errors:

// Trial 1
var mytree = $('#dialogtreediv').data('kendoTreeView').dataItem(e.node);
console.log (mytree); // -> undefined
mytree.text('New text');  // -> TypeError: undefined is not an object (evaluating 'mytree.text');

 

// Trial 2
var mytree = $("#dialogtreediv").data("kendoTreeView");
var selected = mytree.select();
var selItem = mytree.dataItem(selected);

console.log (selItem); // -> Found: proper output, so its there!

selItem.text('New text');  // -> TypeError: selItem.text is not a function. (In 'selItem.text('New text')', 'selItem.text' is "Leerer Text")

('Leerer Text' is the set text of the selected node)

Whats wrong with those trials and why is the function text() not working? 

Regards

 

 

[Tayger]

On trial2 I also tried: 

selItem.text = 'set this text';

.... instead of selItem.text('New text');

But no success, just nothing happens

[Tayger]

Another trial (not working):

$("#dialogtreediv").data("kendoTreeView").select(".k-first");
var treeview = $("#dialogtreediv").data("kendoTreeView");
console.log (treeview.dataSource.data()[0].text); // -> Its there: current text in output
treeview.dataSource.data()[0].text = 'new text';
treeview.dataSource.read();

 

I don't give up, will find a hack!

 

 

[Ivan Danchev]

Hello,

This post is to prevent any confusion with regard to getting a proper reference to the TreeView. The correct selector to be used in the example Constantine posted is "#treeview" as the widget will be rendered with id="treeview" : 
​

var data = $('#treeview').data('kendoTreeView').dataItem(e.node);

Regards,
Ivan Danchev
Telerik by Progress

 

 

[Tayger]

Found a proper solution to set a next in a treenode, no answer required:

var dialogTree = $("#dialogtreediv").data("kendoTreeView");
var dialogItem = dialogTree.select();
// text function requires a second parameter
dialogTree.text(dialogItem, 'New text');

 

[Ivan Danchev]

Hello Farai,

As you have found out the TreeView's text() ​method can be used to get or set a node's text. You can find more information about this method in the API documentation.

Regards,
Ivan Danchev
Progress Telerik

[Mike]

If you are in the onTreeSelect it looks like this...

function onTreeSelect(e) {
var data = this.dataItem(e.node);
currentFolder = data.id;
}