Kendo UI DropDownList valueTemplate in selected value

http://www.kendoui.com/forums/kendo-ui-web/dropdownlist/display-template-in-selected-dropdownlist-value.aspx

by zacharydl

HTML

<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<div id="example">
    <input data-role="dropdownlist"
           data-bind="source: locations,
                      value: location"
           data-value-field="locationID"
           data-template="city-state-template"
           data-value-template="city-state-template"
    />
</div>

<script type="text/x-kendo-template" id="city-state-template">
    #= data.city#, #= data.state#
</script>

JavaScript

var model = kendo.observable({
    location: null,
    locations: function () {
        return [
            { locationID: 1, city: "Albuquerque", state: "NM" },
            { locationID: 2, city: "Seattle", state: "WA" },
            { locationID: 3, city: "Las Vegas", state: "NV" }
        ];
    }
});

kendo.bind($('#example'), model);