JSFiddle - React, Tailwind, and code Playground

by valchev

HTML

<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.2.710/styles/kendo.mobile.all.min.css">
<input id="combo1" type="text" />
<input id="combo2" type="text" />
<div id="display"></div>

JavaScript

var data = [
    { foo: "item1" },
    { foo: "item2" },
    { foo: "item3" }
];

$("#combo1").kendoComboBox({
    index: 0,
    placeholder: "Select Entity",
    dataTextField: "foo",
    dataValueField: "foo",
    filter: "contains",
    dataSource: {
        data: data    
    },
    close: function(e) {       
       $("#combo2").data("kendoComboBox").dataSource.read(); 
    }                
});

$("#combo2").kendoComboBox({
    index: 0,
    placeholder: "Select Entity",
    dataTextField: "foo",
    dataValueField: "foo",
    filter: "contains",
    dataSource: {
        data: data    
    },
    dataBound: function(e) {
        console.log("Combo2 DS readed");
        $("<p>Combo2 DS read</p>").appendTo("#display");
    }        
});