Hi. We are having troubles with not being able to move dhtmlxWindow objects to different locations in the browser window by dragging. I have verified that the sample code from this site (which uses the all-in-one dhtmlx.js include file) creates windows that can dragged, but when I slightly modify that code to replace the all-in-one dhtmlx.js reference with the separate source files (which we use to keep the page download size under control), the same code results in windows that are locked in place. Are we missing an include or something else that enables dragging of these windows? The test code (as I said, only slightly modified from the sample on this website) is shown below, in which i have included every separate dhtmlx source file that would seem to potentially be applicable (and placing them all in an “exper” folder to keep them separate from our production code for this test). We are using dhtmlxSuite 5.1 Pro.
<!DOCTYPE html>
<html>
<head>
<title>Modal windows</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="stylesheet" type="text/css" href="dhtmlx/exper/dhtmlxwindows_dhx_skyblue.css"/>
<script src="dhtmlx/exper/dhtmlxcommon.js"></script>
<script src="dhtmlx/exper/connector.js"></script>
<script src="dhtmlx/exper/dhtmlxcontainer.js"></script>
<script src="dhtmlx/exper/dhtmlxcore.js"></script>
<script src="dhtmlx/exper/dhtmlxdataprocessor.js"></script>
<script src="dhtmlx/exper/dhtmlxwindows.js"></script>
<style>
div.controls {
margin: 0px 10px;
font-size: 14px;
font-family: Tahoma;
color: #404040;
height: 80px;
}
div#winVP {
position: relative;
height: 350px;
border: 1px solid #dfdfdf;
margin: 10px;
}
</style>
<script>
var dhxWins, w1, w2, w3;
function doOnLoad() {
dhxWins = new dhtmlXWindows();
// dhxWins.attachViewportTo("winVP");
w1 = dhxWins.createWindow("w1", 20, 30, 320, 200);
w1.setText("dhtmlxWindow #1");
w1.button("close").disable();
w2 = dhxWins.createWindow("w2", 50, 70, 320, 200);
w2.setText("dhtmlxWindow #2");
w2.button("close").disable();
w3 = dhxWins.createWindow("w3", 80, 110, 320, 200);
w3.setText("dhtmlxWindow #3");
w3.button("close").disable();
}
function changeModality(id, mode) {
if (mode) {
dhxWins.window(id).setModal(true);
} else {
dhxWins.window(id).setModal(false);
}
}
function doOnUnload() {
if (dhxWins != null && dhxWins.unload != null) {
dhxWins.unload();
dhxWins = w1 = w2 = w3 = null;
}
}
</script>
</head>
<body onload="doOnLoad();" onunload="doOnUnload();">
<div id="winVP"></div>
<div class="controls">
Window #1 <input type="button" value="modal-true" onclick="changeModality('w1', true);"><input type="button" value="modal-false" onclick="changeModality('w1', false);"><br>
Window #2 <input type="button" value="modal-true" onclick="changeModality('w2', true);"><input type="button" value="modal-false" onclick="changeModality('w2', false);"><br>
Window #3 <input type="button" value="modal-true" onclick="changeModality('w3', true);"><input type="button" value="modal-false" onclick="changeModality('w3', false);">
</div>
</body>
</html>