Click Tree and Open Popup Window
Dear Support Team,
Could you help to give a simple sample if i want to click item from the tree in cell a with 2U layout and when click the tree item it will popup window (320px x 240px) attach url from google.com
thx a lot
regards,
Robby
Answer posted by Alex (support) on Nov 09, 2009 04:55
Dear Robby,
probably you use attachTree method to place tree into the layout cell:
dhxTree = dhxLayout.cells("a").attachTree();
So, tree object is known. In order to execute some code when tree item is clicked you can use onClick event handler:
dhxWins = new dhtmlXWindows();
...
tree.attachEvent("onClick",function(itemId,previousSelected){
w1 = dhxWins.createWindow("w1", 20, 30, 320, 240);
w1.attachURL("http://www.google.com/");
})
Answer posted by Robby on Nov 09, 2009 18:19
Dear Alex,
I have succeed to open new window when click the item from tree based on your sample and i make some change that tree is used xml code. Now, i want to close that window but never see the close item in the windows, here is my code (i give a bold for related open window code) :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Cintia - CCBDG Suite Application</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="mm_restaurant1.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="./dhtmlxLayout/codebase/dhtmlxlayout.css">
<link rel="stylesheet" type="text/css" href="./dhtmlxLayout/codebase/skins/dhtmlxlayout_dhx_black.css">
<script src="dhtmlxLayout/codebase/dhtmlxcommon.js"></script>
<script src="dhtmlxLayout/codebase/dhtmlxlayout.js"></script>
<script src="dhtmlxLayout/codebase/codebase/patterns/dhtmlxlayout_pattern4a.js"></script>
<script src="dhtmlxLayout/codebase/dhtmlxcontainer.js"></script>
<link rel="STYLESHEET" type="text/css" href="./dhtmlxTabbar/codebase/dhtmlxtabbar.css">
<script src="./dhtmlxTabbar/codebase/dhtmlxcommon.js"></script>
<script src="./dhtmlxTabbar/codebase/dhtmlxtabbar.js"></script>
<script src="./dhtmlxLayout/codebase/dhtmlxlayout.js"></script>
<link rel="STYLESHEET" type="text/css" href="./dhtmlxTree/codebase/dhtmlxtree.css">
<script src="./dhtmlxTree/codebase/dhtmlxcommon.js"></script>
<script src="./dhtmlxTree/codebase/dhtmlxtree.js"></script>
<script language="JavaScript" src="./dhtmlxMenu/codebase/dhtmlxmenu.js"></script>
<script language="JavaScript" src="./dhtmlxMenu/codebase/ext/dhtmlxmenu_ext.js"></script>
<link rel="stylesheet" type="text/css" href="./dhtmlxAccordion/codebase/skins/dhtmlxaccordion_dhx_black.css">
<script src="./dhtmlxAccordion/codebase/dhtmlxcommon.js"></script>
<script src="./dhtmlxAccordion/codebase/dhtmlxaccordion.js"></script>
<link rel="stylesheet" type="text/css" href="./dhtmlxWindows/codebase/dhtmlxwindows.css">
<link rel="stylesheet" type="text/css" href="./dhtmlxWindows/codebase/skins/dhtmlxwindows_dhx_skyblue.css">
<script src="./dhtmlxWindows/codebase/dhtmlxcommon.js"></script>
<script src="./dhtmlxWindows/codebase/dhtmlxwindows.js"></script>
<script src="./dhtmlxWindows/codebase/dhtmlxcontainer.js"></script>
<div id="parentId" style="width:100%; height:100%; aborder: #B5CDE4 1px solid;"></div>
<style>
html, body {
width: 100%;
height: 98.2%;
margin-top: 0.65cm;
margin-left: 0cm;
margin-right: 0cm;
padding: 0px;
overflow: hidden;
}
</style>
</head>
<input type="button" value="close window" onclick="closeWindow();">
<script>
var dhxLayout;
dhxTree;
dhxTabbar;
dhxTextHeaderA;
dhxTextHeaderA;
dhxAccord;
dhxWins
function doOnLoad()
{
dhxTabbar=new dhtmlXTabBar("parentId","top");
dhxTabbar.setSkin('dhx_black');
dhxTabbar.setImagePath("./dhtmlxTabbar/codebase/imgs/");
dhxTabbar.addTab("a2","Caroline","150px");
dhxTabbar.setTabActive("a2");
var layout = dhxTabbar.cells("a2").attachLayout("4A");
//var dhxTree = layout.cells("a").attachTree();
//dhxTree.setImagePath("./dhtmlxTree/codebase/imgs/csh_bluefolders/");
//dhxTree.loadXML("./dhtmlxTree/samples/common/tree.xml?etc=" + new Date().getTime());
var dhxTextHeaderA = layout.cells("a").setText("Tree");
var dhxTextHeaderB = layout.cells("b").setText("Monitor");
var dhxTextHeaderC = layout.cells("c").setText("Ask Me");
var dhxTextHeaderD = layout.cells("d").setText("Webs");
//var dhxRealtime = layout.cells("c").attachURL("http://10.3.15.232/aplikasi/realtime1/index.php");
var dhxAccordss = layout.cells("a").attachAccordion();
dhxAccordss.addItem("aa1", "Links");
dhxAccordss.addItem("aa2", "Tools");
dhxAccordss.openItem("aa1");
var dhxWins= new dhtmlXWindows();
var dhxTreeAccordss = dhxAccordss.cells("aa1").attachTree();
dhxTreeAccordss.setImagePath("./dhtmlxTree/codebase/imgs/csh_bluefolders/");
dhxTreeAccordss.loadXML("./dhtmlxTree/samples/common/caroline.xml?etc=" + new Date().getTime());
dhxTreeAccordss.attachEvent("onClick",function(id)
{
dhxAccordss.cells("d2").attachURL(dhxTreeAccordss.getUserData(id,"url"));
}
)
var dhxToolAccordss = dhxAccordss.cells("aa2").attachTree();
dhxToolAccordss.setImagePath("./dhtmlxTree/codebase/imgs/csh_bluefolders/");
dhxToolAccordss.loadXML("./dhtmlxTree/samples/common/tool.xml?etc=" + new Date().getTime());
dhxToolAccordss.attachEvent("onClick",function(id)
{
dhxWins.enableAutoViewport(false);
dhxWins.setViewport(350, 50, 400, 400);
dhxWins.vp.style.border = "#909090 1px solid";
dhxWins.setImagePath("./dhtmlxWindows/codebase/imgs/");
w1 = dhxWins.createWindow("w1", 20, 30, 320, 240);
w1.setText("Panduan Solusi");
w1.center();
w1.allowMove();
w1.attachURL(dhxToolAccordss.getUserData(id,"url"));
}
)
var dhxAccordss = layout.cells("b").attachAccordion();
dhxAccordss.addItem("bb1", "ASTINA");
dhxAccordss.addItem("bb2", "REALTIME SL/SCR");
dhxAccordss.addItem("bb3", "CLOCK");
dhxAccordss.openItem("bb1");
var dhxAccordss = layout.cells("c").attachAccordion();
dhxAccordss.addItem("c1", "Panduan Solusi");
dhxAccordss.addItem("c2", "Chat");
dhxAccordss.openItem("c1");
dhxAccordss.cells("c2").attachURL("http://10.3.15.232/aplikasi/ccbdgsuite/time.html");
var dhxAskTressAccordss = dhxAccordss.cells("c1").attachTree();
dhxAskTressAccordss.setImagePath("./dhtmlxTree/codebase/imgs/csh_bluefolders/");
dhxAskTressAccordss.loadXML("./dhtmlxTree/samples/common/panduan.xml?etc=" + new Date().getTime());
dhxAskTressAccordss.attachEvent("onClick",function(id)
{
dhxAccordss.cells("d2").attachURL(dhxAskTressAccordss.getUserData(id,"url"));
}
)
var dhxAccordss = layout.cells("d").attachAccordion();
dhxAccordss.addItem("d1", "Application1");
dhxAccordss.addItem("d2", "Application2");
dhxAccordss.openItem("d1");
dhxAccordss.cells("d2").attachURL("http://yahoo.com");
var dhxAccordssTabbar = dhxAccordss.cells("d1").attachTabbar();
dhxAccordssTabbar.setSkin('dhx_black');
dhxAccordssTabbar.setImagePath("./dhtmlxTabbar/codebase/imgs/");
dhxAccordssTabbar.addTab("d11","Google","150px");
var dhxAccordssTabbarURLb11 = dhxAccordssTabbar.cells("d11").attachURL("http://google.com/");
}
</script>
<body bgcolor="#99ccff" BACKGROUND="./_notes/iris_header.gif" BGPROPERTIES=FIXED onload="doOnLoad();">
</body>
</html>
Answer posted by Alex (support) on Nov 10, 2009 02:00
Hello,
>> Now, i want to close that window but never see the close item in the windows
Please, check that you use all images for dhx_skyblue skin. They are dhtmlxWindows/codebase/imgs/dhxwins_dhx_skyblue
Answer posted on Nov 10, 2009 03:21
Dear Alex,
Thanks a lot for your help, now the window normaly. But there are another problem, when i click the close bar, it cannot clos, minimize and maximize is ok (working) only close cannot.
Here is my part code (i use xml code to iFrame google.com in that window):
w1 = dhxWins.createWindow("w1", 20, 30, 320, 240);
w1.setText("Panduan Solusi");
w1.center();
w1.allowMove();
w1.close();
w1.attachURL(dhxToolAccordss.getUserData(id,"url"));
which part i'm wrong ?
BR,
Robby
Answer posted by Alex (support) on Nov 10, 2009 06:38
there was a bug with closing window if the url is attached into it.
Please, try to use attached files instead of the originals. Probably they will solve the issue
Attachments (2)
Answer posted by Robby on Nov 10, 2009 19:47
Dear Alex,
It still same result, i cannot close the windows. Any sugestion ?
regard,
Robby
Answer posted by Alex (support) on Nov 11, 2009 02:28
Hello,
could you please provide the complete demo, sample that allows to recreate the problem. It can be also sent to support@dhtmlx.com
Answer posted by Robby on Nov 11, 2009 03:34
Dear Support team,
thanks for your support, i appreciate it. I already send the source code by yahoo mail with subject : Click Tree and Open Popup Window Source Code
thank you,
regard,
Robby
Answer posted by Alex (support) on Nov 11, 2009 07:18
Hello,
we have got the sample. The answer will be sent by eamil.
Answer posted by Robby on Nov 11, 2009 16:49
Dear Support Team,
Thanks a lot, it works now, thank you for your best support :)
regards,
Robby
