I have placed all the javascripts on my server, and my file works fine, when I use:
<script src="codebase/dhtmlx.js" type="text/javascript"></script>
I would like to be able to read or edit the javascript, when needed, and the file above is illegible in windows, unless I will spend 3 hours to do line breaks and paragraphs. So I tried to load each JS separately, using the example here:
dhtmlx.com/docs/products/dem … index.html
I copied their load order, but my files will not work when the javascripts are loaded separately. I have also tried other ways, but it never works.
<script src="codebase/dhtmlxcommon.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxgrid.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/ext/dhtmlxgrid_drag.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxgridcell.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/ext/dhtmlxgrid_srnd.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxtree.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxlayout.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxtoolbar.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxwindows.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxcontainer.js"></script>
Here is the html.
Does the load order change, depending on what you write in the html?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>ActionBuilder</title>
<link rel="stylesheet" type="text/css" href="codebase/css/index.css">
<link rel="stylesheet" type="text/css" href="codebase/css/forms.css">
<link rel="stylesheet" type="text/css" href="codebase/css/grid.css">
<link rel="stylesheet" type="text/css" href="codebase/css/layout.css">
<link rel="stylesheet" type="text/css" href="codebase/css/tree.css">
<link rel="stylesheet" type="text/css" href="codebase/css/dhtmlxlayout_dhx_blue.css">
<link rel="stylesheet" type="text/css" href="codebase/css/dhtmlxmenu_dhx_blue.css">
<script src="codebase/dhtmlxcommon.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxgrid.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxgridcell.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/ext/dhtmlxgrid_drag.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxtree.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxlayout.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxtoolbar.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxwindows.js" type="text/javascript" charset="utf-8"></script>
<script src="codebase/dhtmlxcontainer.js"></script>
<script>
function buildInterface(){
var dhxLayout = new dhtmlXLayoutObject(document.body,"2U");
var menu = dhxLayout.attachMenu();
dhxLayout.cells("a").setWidth(400);
dhxLayout.cells("a").setText("Scenario Tree");
dhxLayout.cells("a").attachObject("cell1");
dhxLayout.cells("b").setText("Activity and Event Editor");
dhxLayout.cells("b").attachObject("cell2");
}
dhtmlxEvent(window,"load", buildInterface);
</script>
</head>
<body>
<div id="cell1" style="width:100%; height:100%; overflow-y:visible;">
<div style="overflow:visible;">
<table style="width:100%; height:100%;"><tr><td id="scenTree" style="vertical-align:top;">
<script>
var stree = new dhtmlXTreeObject("scenTree","100%","100%",0);
stree.loadXML("Tree.xml");
stree.setImagePath("codebase/imgs/csh_bluebooks/");
stree.enableDragAndDrop(true, true);
stree.setDragBehavior(complex, true);
</script>
</td></tr></table>
</div>
</div>
<div id="cell2">
<div style="width:59%; height:100%; float:left;">
<form class="abform">
<ol>
<li>
<label for="aname">Name</label>
<input type="text" name="aname" />
</li>
<li>
<label for="adesc">Description</label>
<textarea cols="25" rows="7" id="adesc"></textarea>
</li>
</ol>
</form>
<div id="gridbox" style="width:400px; height:250px;"></div>
<script>
grid = new dhtmlXGridObject('gridbox');
grid.setImagePath("../../codebase/imgs/");
grid.setSkin("dhx_skyblue");
grid.loadXML("SampleGrid.xml");
grid.enableDragAndDrop(true);
grid.setDragBehavior(sibling);
</script>
</div>
<div style="width:39%; height:100%; background-color:#ff0000; float:right; overflow-y:visible;">
<div id="masterList" style="width:100%;height:100%"></div>
<script>
var mtree = new dhtmlXTreeObject("masterList","100%","100%",0);
mtree.loadXML("Master.xml");
mtree.setImagePath("codebase/imgs/csh_bluebooks/");
mtree.enableDragAndDrop(true, true);
mtree.setDragBehavior(complex, true);
</script>
</div>
</div>
</body>
</html>