Kendo Popup Dropdown List Underneath
by siliconsoul
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="firstPopup">
<input id="color" type="text" />
<div id="secondPopup" style="display:none">Close and then open the Multiselect</div>
<br />
<button id="openPopup">Open Second Popup</button>
</div>
<button id="reopen" style="display:none">Re-open First Popup</button>
JavaScript
$('#firstPopup').kendoWindow();
$('#secondPopup').kendoWindow({
modal: true
});
var data = [
{ text: "Black", value: "1" },
{ text: "Orange", value: "2" },
{ text: "Grey", value: "3" }
];
$("#color").kendoMultiSelect({
dataTextField: "text",
dataValueField: "value",
dataSource: data,
index: 0
});
$('#openPopup').click(function () {
$('#secondPopup').data('kendoWindow').center().open();
});
$('#reopen').click(function () {
$('#firstPopup').data('kendoWindow').open();
$('#reopen').hide();
});
$('#firstPopup').data('kendoWindow').bind('close', function () {
$('#reopen').show();
});