JSFiddle - React, Tailwind, and code Playground

by chanaka1

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<script src="http://cdn.kendostatic.com/2012.1.515/js/kendo.all.min.js"></script>
<select size="1" name="myPulldown" id="myPulldown">
    <option value="None" selected>None</option>
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

JavaScript

var pulldownWidth = $("#myPulldown").outerWidth() + 10;
var myComboBox = $("#myPulldown").width(pulldownWidth).kendoComboBox().data("kendoComboBox");

//Dynamically change the values of the pulldown
var options = [];
options.push("<option value=101>Hundred One</option>");
options.push("<option value=102>Hundred Two</option>");
options.push("<option value=121>Hundred Twenty One</option>");
options.push("<option value=1024>One Thousan Twenty Four</option>");

$("#myPulldown").html(options.join(''));

//myComboBox.refresh();
//Not re-rendering the new data.

$("#myPulldown").removeAttr("style").hide();

var pulldownWidth2 = $("#myPulldown").outerWidth() + 50;

var myComboBox2 = $("#myPulldown").width(pulldownWidth2).kendoComboBox().data("kendoComboBox");
//Re-rendering the new data but width is not changing