TreeView .Select - get text of selected node

[Erik]

Hi everyone,

I have aproblem with the Kendo UI TreeView and I'm looking for a solution for a while now.

In my view I fill my TreeView like this:

Html.Kendo().TreeView()
                    .Name("treeview")
                    .BindTo((IEnumerable<TreeViewItemModel>) ViewBag.inlineDefault)
                    .Events(events => events
                        .Select("onSelect")
 )

private IEnumerable<TreeViewItemModel> GetDefaultInlineData(ArrayList tables)
        {
            List<TreeViewItemModel> names = tables.Cast<TreeViewItemModel>().ToList();

            List<TreeViewItemModel> inlineDefault = new List<TreeViewItemModel>
            {
                    new TreeViewItemModel
                    {
                        Text = "Tables",
                        Items = names
                    }
            };

            return inlineDefault;
        }

My onSelect funtion is the following:

<script>
    function onSelect(e) {
        $.ajax({
            type: 'POST',
            url: '/Editor/GetTableContent' ,
            data: { tableName: ?????? },
            success: function (data) {
                $('#table').html(data);
            }
        }).done(function () {
            alert('Done');
        });
    }
</script>

It calls a mehtod in my controller that needs the name of the selected node as parameter (string) to display the content of a table in a grid.

Is there a possibility to get what I need?

Thx for your help!

Erik

[Erik]

To get the text of the selected node:

var nodeText = this.text(e.node);

 

this == the TreeView(can also use e.sender instead of this)
e.node == the selected node.

[Ivan Danchev]

Hello Erik,

We are glad you have found a way to get the selected node's text. As an alternative to: this.text(e.node); you can get it through the event data like this: e.node.textContent

Regards,
Ivan Danchev
Telerik by Progress

[Doug]

Hello,

Is there a way to access other properties of TreeViewItemModel from the javascript code embedded in the .cshtml file?

I would like to access the Id property of the node. It this possible?

Thanks,

Doug

[Ivan Danchev]

Hello Doug,

You can access other property values with the TreeView's dataItem method. Attach a select event handler to the TreeView:

.Events(events => events.Select("onSelect"))

and call the dataItem method passing the selected node as a parameter:

function onSelect(e) {
    var dataItem = e.sender.dataItem(e.node);
    console.log(dataItem.id);
}

Through the data item returned by the method you can access the property value, e.g. dataItem.id

Regards,
Ivan Danchev
Progress Telerik