0

Generic Tree Menu event handler

asked 2016-09-09 10:02:22 +0000

jomir gravatar image jomir
0

Hi, I have an application that using MVC pattern, ZK 8 version and Tree component as a menu. The application itself using border layout and Tabbox as a dynamic container. The menu tree code is adding tab when it is clicked. I have successfuly do this, but in an inefficient manner. Is there an efficient alternatives or ways to refactor?

The codes are:

<zk>
<style src="css/style.css" />
<borderlayout>
    <north>
        <div height="120px"
            style="background:#3461b2
            url('images/banner.jpg')no-repeat;" />

    </north>

    <west title="Selamat Datang - ${sessionScope.userCredential.name}"
    size="22%" autoscroll="true" splittable="true" collapsible="true"
    vflex="max">
    <tree id="menuTree">
    <treechildren>
        <treeitem label="Daily">
        <treechildren>
        <treeitem label="Report 1">
         <attribute name="onClick">
<![CDATA[
Tab newTab;
if (mainTabbox.getTabs().hasFellow("Report 1")) {
    newTab = (Tab) mainTabbox.getTabs().getFellow("Report 1");
    mainTabbox.setSelectedTab(newTab);
} else {
    newTab = new Tab("Report 1");
    newTab.setId("Report 1");
    newTab.setClosable(true);
    newTab.setSelected(true);
    Tabpanel tb = new Tabpanel();
    Executions.createComponents("daily/report1.zul", tb, null);
    mainTabbox.getTabs().appendChild(newTab);
    mainTabbox.getTabpanels().appendChild(tb);
}
     ]]>
      </attribute>
    </treeitem>
    <treeitem label="Logs">
            <attribute name="onClick">
        <![CDATA[
Tab newTab;
if (mainTabbox.getTabs().hasFellow("Logs")) {
    newTab = (Tab) mainTabbox.getTabs().getFellow("Logs");
    mainTabbox.setSelectedTab(newTab);
} else {
    newTab = new Tab("Logs");
    newTab.setId("Logs");
    newTab.setClosable(true);
    newTab.setSelected(true);
    Tabpanel tb = new Tabpanel();
    Executions.createComponents("Logs.zul", tb, null);
    mainTabbox.getTabs().appendChild(newTab);
    mainTabbox.getTabpanels().appendChild(tb);
}
      ]]>
      </attribute>
    </treeitem>
     ...
     ...
     <center vflex="min" autoscroll="true">
       <div height="100%">
    <tabbox id="mainTabbox">
    <tabs id="tabs">
    <tab id="mainTab" label="Main" />
    </tabs>
    <tabpanels>
        <tabpanel>
        <include src="/charts/mainChart.zul" />
        </tabpanel>
                </tabpanels>
            </tabbox>
        </div>
    </center>
       ....
delete flag offensive retag edit

1 Answer

Sort by ยป oldest newest most voted
0

answered 2017-02-17 07:57:56 +0000

jomir gravatar image jomir
0

I'll answer my own question: Just add a Listen event for treeitem. Use treeitem as event selector. Code example below:

@Listen("onClick = treeitem")
public void addTab(MouseEvent event) {
    Treeitem item = (Treeitem) event.getTarget();

    if (item != null && item.getValue() != null) {
        createTab(mainTabbox, item.getValue().toString().concat("-tab"), item.getLabel(),
                item.getValue().toString());
        log.debug("On Click Called, Tab: {}", item.getLabel());
    }
}`
link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow
1 follower

RSS

Stats

Asked: 2016-09-09 10:02:22 +0000

Seen: 41 times

Last updated: Feb 17

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More