0

How to use same object for multiple zk components

asked 2012-01-19 14:16:25 +0800

vsony7 gravatar image vsony7
102 1

Hi,

Say I have a zul page like so:

<zk>
<tree id="tree1">
<tree id="tree2">
</zk>

I need to create an object which can be set to different zk components depending on conditions. The conditions could be events, for example:

If a treerow of tree1 is clicked ---> set the object to tree1 --> then I should be able to access the object i.e. tree1 from multiple java classes and modify it
If a treerow of tree2 is clicked ---> set the object to tree1 --> then I should be able to access the object i.e. tree1 from multiple java classes and modify it

What is the best approach to achieve this task? Maybe I can set an object in Desktop and use it, but I am not sure how to do this. Can someone point me to suitable documentation or examples?

Thanks

delete flag offensive retag edit

5 Replies

Sort by » oldest newest

answered 2012-01-20 01:01:00 +0800

hawk gravatar image hawk
3250 1 5
http://hawkphoenix.blogsp... ZK Team

HI,
zk will still create 2 tree components according to your zul. What's your requirement of scenario?
It seems that you want to display a group of data in one of 2 trees which is determined by user clicking. If so, you can put your data into a tree model and listen to onClick event. When event fires, set one of tree's model to display the data.

link publish delete flag offensive edit

answered 2012-01-20 02:16:15 +0800

vsony7 gravatar image vsony7
102 1

Hi,

Yes, I do want two trees to be created. Please see the following code:

<zk>
<borderlayout>
  <west size="50%">
    <vlayout hflex="1">
      <tree id="tree1">
        <treechildren>
          <treeitem>
            <treerow>
              <treecell label="Tree 1" />
            </treerow>
          </treeitem>
        </treechildren>
      </tree>
      <tree id="tree2">
        <treechildren>
          <treeitem>
            <treerow>
              <treecell label="Tree 2" />
            </treerow>
          </treeitem>
        </treechildren>
      </tree>
    </vlayout>
  </west>
  <center>
    <vlayout id="layout1" />
  </center>
</borderlayout>
</zk>

Using the above code, I want to display information in layout1 depending on which tree cell is clicked. Say, I click on "Tree 1" then I want to display information in layout1 such as "You have selected Tree1." Next, if I select "Tree 2", the information in layout1 would change to "You have selected Tree2".

This is a very simplified version of my requirement. The idea is to have a desktop object or variable which can store a component. So, on_click event of a tree row should set the parent tree to this object. Then, I should be able to access this object(selected tree in this case) and modify several other components in my application. The idea really is that many components in my application are tied to the selected tree.

Thanks

link publish delete flag offensive edit

answered 2012-01-20 08:57:37 +0800

RichardL gravatar image RichardL
768 4

How about sending or posting out a custom event on the click of the trees' items then have listeners for this event in any components you want to (http://books.zkoss.org/wiki/ZK_Developer%27s_Reference/Event_Handling/Event_Firing).

link publish delete flag offensive edit

answered 2012-01-20 16:14:38 +0800

twiegand gravatar image twiegand
1807 3

updated 2012-01-20 22:54:55 +0800

vsony7,

There are a few ways to do what you ask (if I understand what you want).  Assuming you are using a composer, you can do something like this:

composer

import org.zkoss.zk.ui.util.GenericForwardComposer;
	
public class MyController extends GenericForwardComposer {
	Label treeValue;
	public void onClickTree(Event event) {
		treeValue.setValue(event.getOrigin().getTarget().getLabel());
	}
}

zul

<zk>
	<window id="main" apply="MyController" height="100%" width="100%">
		<borderlayout>
			<west size="50%">
				<vlayout hflex="1">
					<tree id="tree1">
						<treechildren>
							<treeitem>
								<treerow>
									<treecell label="Tree 1" forward="onClick=onClickTree"></treecell>
								</treerow>
							</treeitem>
						</treechildren>
					</tree>
					<tree id="tree2">
						<treechildren>
							<treeitem>
								<treerow>
									<treecell label="Tree 2" forward="onClick=onClickTree"></treecell>
								</treerow>
							</treeitem>
						</treechildren>
					</tree>
				</vlayout>
			</west>
			<center>
				<hlayout>
					<label value="You have selected:  "></label>
					<label id="treeValue"></label>
				</hlayout>
			</center>
		</borderlayout>
	</window>
</zk>

By autowiring the "treeValue" label, I can do whatever I want in my Composer and ZK will handle the rest (e.g. displaying the value, even if I change it on the fly).

If you get into data binding, you could use custom-attributes as another approach.  As with most things in ZK, there is usually more than one way to accomplish what you need to do.

Hope that helps,

Todd

link publish delete flag offensive edit

answered 2012-01-22 00:40:34 +0800

vsony7 gravatar image vsony7
102 1

Hi Todd,

Thanks for your help. I am working on data-binding so the custom-attributes approach worked.

Best,
Sony

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: 2012-01-19 14:16:25 +0800

Seen: 228 times

Last updated: Jan 22 '12

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