Kendo template

HTML

<script src="http://cdn.kendostatic.com/2012.3.1315/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.common.min.css">
<input id="RelatedProduct"  data-template="productTemplate" data-bind="source:productsSource"  data-role="combobox" data-text-field="calc" data-value-field="ID" data-filter="contains" />


 <script id="productTemplate" type="text/x-kendo-tmpl">
            <span> #= Manufacturer # #= Name #  </span>
    </script>

JavaScript

var viewModel = new kendo.observable({
    productsSource: new kendo.data.DataSource({
        data: [
            {ID: 1, Name: "Galaxy SII", Manufacturer: "Samsung"},
            {ID: 1, Name: "Galaxy SII", Manufacturer: "Samsung"},
            {ID: 1, Name: "Xperia Z", Manufacturer: "Sony"},
            {ID: 1, Name: "iPhone 5", Manufacturer: "Apple"},
        ],
            schema: {
                        model: {
                            fields: {
                                ID: { type: "number" },
                                Name: { type: "string" },
                                Manufacturer: { type: "string" },
                            }
                        }
            ,
            parse:function(data){
                return $.map(data,function(value){
                    value.calc = value.Manufacturer + ' ' + value.Name;
                    return value;
                })
            }
                    },
    })
})
            
            kendo.bind(document.body, viewModel);