New to Kendo UI for jQuery? Start a free 30-day trial

ValueTemplate

configuration

The template used to render the value and the or the selected tags.

valueTemplate

String|Function

<input id="dropdowntree" />
<script id="valueTemplate" type="text/x-kendo-template">
    <img src="/img/#: id #.png" alt="#: name #" />
    #: name #
</script>
<script>
$("#dropdowntree").kendoDropDownTree({
  dataSource: [
    { id: 1, name: "Apples" },
    { id: 2, name: "Oranges" }
  ],
  dataTextField: "name",
  dataValueField: "id",
  valueTemplate: kendo.template($("#valueTemplate").html())
});
</script>

<input id="dropdowntree" style="width: 400px;" />
<script>
    $("#dropdowntree").kendoDropDownTree({
        dataSource: [
            { id: 1, name: "Apples" },
            { id: 2, name: "Oranges" }
        ],
        dataTextField: "name",
        dataValueField: "id",
        valueTemplate: '<span><img src="/img/#: id #.png" alt="#: name #" />#: name #</span>'
    });
</script>