Cannot get value of selected item in treeview

7 posts, 1 answers
  1. Phil
    Phil avatar
    30 posts
    Member since:
    Aug 2012

    Posted 04 Jul 2012 Link to this post

    with the old telerik MVC extensions, i could do the following:

    @(Html.Telerik().TreeView().Name("TreeView").HtmlAttributes(new { style = "white-space:normal;width:250px;" }).ClientEvents(events => events
                            .OnLoad("onLoad")
                            .OnSelect("onSelect")
                    )
            .BindTo(Model.RootNode.ChildNodes, mappings =>
            {
                mappings.For<DocReaderNode>(binding => binding
                        .ItemDataBound((item, nd) =>
                        {
                            item.Text = nd.DocTitle;
                            item.Value = nd.DocUrl;
                        })
                        .Children(nd => nd.ChildNodes));
            })
    )
    then i could use the following javascript to get the node value when a node is selected:
    function onSelect(e) {
    var t = $('#TreeView').data('kendoTreeView');
    var selVal = t.getItemValue(e.item) ;
    }
    Now with Kendo, i don't see how to get the value of the selected node any longer.  Any tips? 

  2. Trent
    Trent avatar
    22 posts
    Member since:
    Dec 2011

    Posted 10 Jul 2012 Link to this post

    Hey Phil. Did you get an answer for this? I'm also porting from Telerik to Kendo and ran into the same issue.

    Thanks!

  3. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2043 posts
    Member since:
    Sep 2012

    Posted 10 Jul 2012 Link to this post

    Hello Phil, Trent,

    Depending on your use case, you have two options:

    • Use HtmlAttributes to serialize arbitrary data, item.HtmlAttributes(new { data_foo = "bar" }), and access it through e.item.data("foo")
    • Use the TreeViewItem.Id field, if the serialized data is an Id and will be used for fetching nodes from a remote datasource. This field will be introduced in the upcoming Q2 release this week.
    Kind regards,
    Alex Gyoshev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

  4. Phil
    Phil avatar
    30 posts
    Member since:
    Aug 2012

    Posted 12 Jul 2012 Link to this post

    when you say 'release this week', do you mean the 2012.2.710 release that i just downloaded? 

    That release actually broke the way the treeview used to work entirely.  The bindto(model, mapping => mapping.For .....  no longer exists.  Your documentation still references it at
    http://docs.kendoui.com/api/wrappers/aspnet-mvc/Kendo.Mvc.UI.Fluent/TreeViewBuilder

    however.  Not sure how to proceed with your currennt treeview.

    Additionally, do you have an example with the treeviewitem.id field that you mention below?

  5. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2043 posts
    Member since:
    Sep 2012

    Posted 16 Jul 2012 Link to this post

    > The bindto(model, mapping => mapping.For .....  no longer exists. 

    The method exists (as seen in the Intellisense), but when you have a syntax error in the lambda expression, the c# compiler assumes it has a different type -- and thus complains about the method.

    There is no dedicated example that shows this, so here it goes:

    .BindTo(new List<Employee> () {new Employee { FirstName = "Alex" }}, mappings => {
                mappings.For<Employee>(binding => binding
                    .ItemDataBound((item, employee) =>
                    {
                        item.Text = employee.FirstName;
                        item.Id = "2";
                    }));
            })

    Greetings,
    Alex Gyoshev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

  6. Phil
    Phil avatar
    30 posts
    Member since:
    Aug 2012

    Posted 16 Jul 2012 Link to this post

    Thanks for that, the problem that i was having was assuming there was a TreeViewItem 'value' property in kendo like there was in the Telerik extensions.  Looks like that was taken out.

    For some reason i can't get this ID value in the Select event.  basically, my code is:

    function onSelect(e) {
                        //var treeView = $("#kTreeView").data("kendoTreeView");
                        var nd = e.node;
                        var t = nd.textContent;
                        var v = nd.id;
                        var c = nd.url;
    }
    so nd and the t variables work fine, i see values in them via firebug no problem.  The id and url values give me nothing at all though (I also changed your code above so that the item.Url value is populated.  that value might work better for me more than Id anyways). 

  7. Answer
    Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2043 posts
    Member since:
    Sep 2012

    Posted 18 Jul 2012 Link to this post

    See the dataItem method.

    Greetings,
    Alex Gyoshev
    the Telerik team

    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

Back to Top