JSFiddle - React, Tailwind, and code Playground
HTML
<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">
<script src="http://cdn.kendostatic.com/2012.2.710/js/kendo.web.min.js"></script>
<div>
<div id="Window">
<input type="button" value="Submit" id="Submit"/>
</div>
</div>
JavaScript
$(function() {
$('#Window').kendoWindow({
width:300,
height:300,
draggable:true,
});
$('#Submit').click(function() {
$('<div id="confirmModal"><div id="confirmWindow">Is This Correct?<p><input type="button" id="btnYes" value="Yes" /><input type="button" id="btnNo" value="No" /></p></div></div>').appendTo('#Window');
$('#confirmWindow').kendoWindow({
modal: true,
appendTo: '#Window',
draggable:false,
resizable:false,
draggable:true,
title:false,
close: function() {
setTimeout(function(){
$('#confirmWindow').kendoWindow('destroy');
}, 200);
}
});
$('#confirmWindow').find('#btnNo').click(function () {
$('#confirmWindow').kendoWindow('close');
});
$('#confirmWindow').find('#btnYes').click(function () {
$('#confirmWindow').kendoWindow('close');
});
});
});