Kendo MVC DropdownTree not displaying selected value

Question

I have a Kendo MVC DropdownTree in may page. I am successfully saving the selected value from it into database. When I come to edit the data, the value is correctly returned from the model and set in the DropdownTree, however, no item is visually getting selected in the dropdown tree.

When I try to read the value of the dropdown tree from a button click, it correctly returns the value.

@(Html.Kendo().DropDownTree()
                .Name("VocationID")
                .DataTextField("Name")
                .DataValueField("Id")
                .ValuePrimitive(true)
                .Placeholder("--Select Vocation--")                            
                .Value(Model.VocationID.ToString())
                .DataSource(dataSource => dataSource
                    .Read(read => read
                    .Action("GetVocationTree", "ApplicationForm"))
                )
                .HtmlAttributes(new { style = "width: 250px;", required = "required", validationMessage = "Vocation is required" })
             )

function TestValue() {
        var dropdowntree = $("#VocationID").data("kendoDropDownTree");
        alert(dropdowntree.value());
}

The javascript alert above correctly returns the value but no item is displayed as selected in the DropdownTree. I also tried removing the ValuePrimitive attribute but nothing works.

Could someone please help to identify what is missing here?

Answer 1

Found a way to handle this at last. Posting it if it helps someone someday.

This control behaves a little differently. You can read the selected item as ID but need to set its text instead of ID to set the selected item.

Getting the item value:

            var dropdowntree = $("#VocationID").data("kendoDropDownTree");
            var VocationID = dropdowntree.value().id;

and to Set the default value:

            @(Html.Kendo().DropDownTree()
                            .Name("VocationID")
                            .DataTextField("Name")
                            .DataValueField("Id")
                            .Placeholder("--Select Vocation--")
                            .Value(Model.VocationName)

Note the "VocationName" instead of ID.