JSFiddle - React, Tailwind, and code Playground

by Ignacio Fuentes

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css">
<script src="http://cdn.kendostatic.com/2013.2.918/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.silver.min.css">
<script src="http://demos.kendoui.com/content/shared/js/people.js"></script>
<select id="dropdown" data-bind="value: selectedProductId, source: products" >
</select>

JavaScript

var viewModel = kendo.observable({
  selectedProductId: null,
  products: [
    { id: 1, name: "Coffee" },
    { id: 2, name: "Tea" },
    { id: 3, name: "Juice" }
  ]
});



kendo.bind($("#dropdown"), viewModel);



$("#dropdown").kendoDropDownList({
  valuePrimitive: true, //change this from true to false to see difference
  dataTextField: "name",
  dataValueField: "id",
  optionLabel: "Select product...",
    change:function(){
        alert(viewModel.selectedProductId);
    }
});