TreeView Events and Accessing Data

[John]

Thank you all in advance for your assistance. I am new to Kendo and trying to work my way through some event examples. I have two questions.

For my scenario I have an array of items that I am binding to a treeview. Each data item looks like this...
[{"id": 24820, "parentId": 0, "title": "Kendo", "target": "_blank", "href": "http://www.kendoui.com", "active": true, "hasChildren": false}, ...]

Questions #1: Can I access data elements of a node on a select event?

Question #2: Is there a way to cancel page change onSelect? e.preventDefault() does not seem to work for me.

I am trying to use the data above and onSelect determine if the "target" is set to "_blank". If it is, I want to execute an open new window and prevent the current page from changing. If not, I want the normal logic to run.

Sample Code:

<div id="menu" class="k-content">

    <div id="treeview"></div>

</div>

<script type="text/javascript">

    var data = new kendo.data.HierarchicalDataSource({

        transport: {

            read: {

                url: "api/menu",

                type: "GET",

                dataType: "json",

                contentType: "application/json"

            }

        },

        schema: {

            model: {

                id: "id",

            }

        }

    });

 

    function onSelect(e) {

        var targetIsBlank = false;

        // TODO: Check e.node passed and determine if "target" is "_blank"

        if (targetIsBlank) {

            // TODO: open new window with target and href properties

            e.preventDefault(); // this doesn't work when dataUrlField is set

        }

    }

 

    $("#treeview").kendoTreeView({

        dataSource: data,

        dataTextField: "title",

        dataUrlField : "href",

        select: onSelect,

    });

</script>

[Edward Deutscher]

Figured it out:

function onSelect(e) {

        var item = this.dataItem(e.node);

        if(item.target === "_blank") {

            window.open(item.href);

            e.preventDefault();

        } else {

            location.href = item.href;

        }

    }

 

    $("#treeview").kendoTreeView({

        dataSource: data,

        dataTextField: "title",

        select: onSelect,

    });

[zhao]

i have same problem with you, so i want to know, how can i solve it? can you solve it?

[zhao]

You solution didn't solve it, i tried it, when i add this code,

            if (e && (e.preventDefault || e.stopPropagation)) {
                e.preventDefault();
                e.stopPropagation();
            } else {
                window.event.returnValue = false;
                window.event.cancelBubble = true;
            }

but the program was run after code also.