This is a migrated thread and some comments may be shown as answers.

Databound event doesn't fire

1 Answer 161 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
KRichter
Top achievements
Rank 1
KRichter asked on 03 Dec 2013, 08:12 AM
Hi,

I'm using a TreeView like in this  example. It is located in the left pane of a two pane splitter, if that matters. All events fire as they should, except the DataBound one. I already tried to modify the example code, that comes with kendo. It does not work here, too.

My TreeView code:
@(Html.Kendo().TreeView()
    .Name("MyTreeView")
    .BindTo(Model, mappings => mappings.For<TreeViewNode>(binding => binding
        .ItemDataBound((item, node) =>
            {
                item.Text = node.Name;
                item.Id = node.Value.ToString();
                item.Expanded = ViewData[ViewBag.ExpandedCookie] != null &&
                                ((string[])ViewData[ViewBag.ExpandedCookie]).Contains(item.Id);
 
                //item.HtmlAttributes["data-selectable"] = node.Selectable;
 
                if (node.AddOnly)
                    item.HtmlAttributes["data-addOnly"] = true;
                else
                    item.HtmlAttributes["data-addOnly"] = false;
 
                if (!node.Selectable)
                {
                    item.HtmlAttributes["style"] = "color: #888";
                }
                else
                    item.HtmlAttributes["style"] = "color: black";
            })
        .Children(parent => parent.Childs))).HtmlAttributes(new { @class = "k-group" }).Events(e => e
            .Select("onSelect")
            .Expand("updateTreeViewState")
            .Collapse("updateTreeViewState")
            .DragStart("onNodeDragStart")
            .DataBound("onTreeDataBound")
            .Drop("onNodeDrop")).DragAndDrop(true)
    )

And the javascript code:
function onTreeDataBound(e) {
    alert("databound");
}
 
// select event as an example (this works)
function onSelect(e) {
    var dataItem = this.dataItem(e.node);
    $("#ID").val(dataItem.id);
 
    if ($(e.item).attr("data-selectable") == "0" || dataItem.id == "0")
        e.preventDefault();
    else
        // request server for partial view for details and refresh right pane of splitter
        getSplitter("#outerSplitter").ajaxRequest("#right-pane", "/" + getArea() + "/" + getController() + "/Details", { id: dataItem.id });
 
    // update statusbar to default
    $("#lblStatus").text("Ready");
    $("#lblStatus").css('color', 'black', 'font-weight ', 'normal')
    //}
}
Am I missing something here?

Best Regards

Dietmar

1 Answer, 1 is accepted

Sort by
0
Vladimir Iliev
Telerik team
answered on 05 Dec 2013, 07:00 AM
Hi,

Basically current behavior is expected as currently the TreeView is bind to the data on the server side. Please note that the DataBound event is triggered only after binding data on the client side. 

Regards,
Vladimir Iliev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
TreeView
Asked by
KRichter
Top achievements
Rank 1
Answers by
Vladimir Iliev
Telerik team
Share this question
or