0

Tree menu click behavior

asked 2010-04-16 04:59:24 +0800

panpur gravatar image panpur
27

Hello,

I'm creating a tree with 2 menu, add user and user list. Clicking the menu(toolbar button actually) will change the source page of iframe. It works fine if I click the menu for the first time, but nothing happened if I click the same menu afterwards. To make it working again, I have to click other menu first.

In my case, on sucessful add user, it will redirect to another page. So the user will have to click the tree menu again to add another user, which is not working unless he/she click on other menu first.

It seems treecell implements onChange instead onClick ? Can I change this behavior ? Or perhaps there are better approach for my case. Thank you very much.

delete flag offensive retag edit

10 Replies

Sort by ยป oldest newest

answered 2010-04-18 22:35:48 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

Could you please post a runnable example?

link publish delete flag offensive edit

answered 2010-04-18 23:11:30 +0800

panpur gravatar image panpur
27

Hello Chen, this is my home.zul code:

<window apply="ecbackend.HomeComposer" height="100%">
        <borderlayout>
            <north size="15%">
                <hbox>
                    <image src="images/grails_logo.png"/>
                </hbox>
            </north>
            <center autoscroll="true">
                <iframe id="mainFrame" src="merchantList.zul" height="100%" width="100%"/>
            </center>
            <west splittable="true" size="15%">
                <tree>
                    <treechildren>
                        <treeitem label="Merchant Management">
                            <treechildren>
                                <treeitem>
                                    <treerow>
                                        <treecell>
                                            <toolbarbutton id="tbrAddMerchant" label="Add Merchant"/>
                                        </treecell>
                                    </treerow>
                                </treeitem>
                                <treeitem>
                                    <treerow>
                                        <treecell>
                                            <toolbarbutton id="tbrMerchantList" label="Merchant List"/>
                                        </treecell>
                                    </treerow>
                                </treeitem>
                            </treechildren>
                        </treeitem>
                    </treechildren>
                </tree>
            </west>
        </borderlayout>
    </window>

And this is composer code for changing the frame's source:

class HomeComposer extends GrailsComposer {

    def mainFrame, tbrAddMerchant, tbrMerchantList

    def afterCompose = { window ->
        // initialize components here
    }

    def onClick_tbrAddMerchant() {
        mainFrame.src = "createMerchant.zul"
    }

    def onClick_tbrMerchantList() {
        mainFrame.src = "merchantList.zul"
    }
}

link publish delete flag offensive edit

answered 2010-04-18 23:16:24 +0800

Arsen gravatar image Arsen
382 5

Nothing is happened when you change src of frame or include to same value. This is because of zk inner optimization. If you want to reload frame content you should set null value and then real source.

iframe.setSrc(null);
iframe.setSrc(<you url>);

link publish delete flag offensive edit

answered 2010-04-18 23:34:14 +0800

panpur gravatar image panpur
27

Hello Arsen, thank you for the response. I've added

mainFrame.src = null

but the result is still the same, nothing happened. I'm using zk 5 btw.

link publish delete flag offensive edit

answered 2010-04-19 02:13:13 +0800

Arsen gravatar image Arsen
382 5

That worked for me, but I'm using 3.6.4 and Java, but not 5 and Grails. Try some empty page instead of null.

iframe.setSrc("/empty.zul");
iframe.setSrc(<you url>);

link publish delete flag offensive edit

answered 2010-04-19 03:55:50 +0800

panpur gravatar image panpur
27

Nope, still doesn't work for zk 5

link publish delete flag offensive edit

answered 2010-04-19 20:05:27 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

@Panpur,

In ZK5, the JavaScript does the same optimized code, so that you have to override the setSrc method at client side.
For example,

<iframe xmlns:w="http://www.zkoss.org/2005/zk/client" id="mainFrame" src="merchantList.zul" height="100%" width="100%">
    <attribute w:name="setSrc">
        function (value) {
            this._src = value;
            var n = this.$n();
            if (n) n.src = value || '';
	}
    </attribute>
</iframe>

For further details, please take a look at the smalltalk.

link publish delete flag offensive edit

answered 2010-04-19 21:16:34 +0800

panpur gravatar image panpur
27

Hi Chen, it works like charm, mucho gracias! :D

link publish delete flag offensive edit

answered 2011-04-06 02:16:44 +0800

raj gravatar image raj
126 1

updated 2011-04-06 02:24:43 +0800

hi all I m new in ZK & i m student i want create file explorar to do this i create the sample for practic..


<window apply="ecbackend.HomeComposer" height="100%">
<borderlayout>
<north size="15%">
<hbox>
<image src="images/grails_logo.png"/>
</hbox>
</north>
<center autoscroll="true">
<iframe id="mainFrame" src="merchantList.zul" height="100%" width="100%"/>
</center>
<west splittable="true" size="15%">
<tree>
<treechildren>
<treeitem label="Merchant Management">
<treechildren>
<treeitem>
<treerow>
<treecell>
<toolbarbutton id="tbrAddMerchant" label="Add Merchant"/>
</treecell>
</treerow>
</treeitem>
<treeitem>
<treerow>
<treecell>
<toolbarbutton id="tbrMerchantList" label="Merchant List"/>
</treecell>
</treerow>
</treeitem>
</treechildren>
</treeitem>
</treechildren>
</tree>
</west>
</borderlayout>
</window>


now the question is . "If i click on second tree node i.e tbrAddMerchant the page sholud be display on the iframe to do this what i have to do
pls help.... Thanks In Advanc..

link publish delete flag offensive edit

answered 2011-05-01 22:36:50 +0800

jumperchen gravatar image jumperchen
3909 2 8
http://jumperchen.blogspo... ZK Team

Please download the source code of ZKSandbox and dig into its implementation, you will find what you want.

link publish delete flag offensive edit
Your reply
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

RSS

Stats

Asked: 2010-04-16 04:59:24 +0800

Seen: 884 times

Last updated: May 01 '11

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