Dynamic Include SRC when Sidebar onClick Event

asked 2017-06-28 21:26:22 +0800

aswinprem gravatar image aswinprem
2 1

Hi Friends, I am using ZK Admin templete. I am tring to include the src dynamically of the content when sidebar menu onclick but iam getting error as null.

My index.zul

<zk xmlns:n="native">
    <include src="navbar.zul"/>
    <hlayout id="main" spacing="0">
        <include src="sidebar.zul"/>    
        <vlayout spacing="0" hflex="1">
            <include src="breadcrumbs.zul"/>
            <include id="content" src="content.zul"/>


<navbar id="navbar" sclass="nav-list" orient="vertical">
        <navitem label="Home" iconSclass="z-icon-home" selected="true"/>
        <navitem label="New Request" iconSclass="z-icon-dashboard" />
        <navitem label="Search" iconSclass="z-icon-text-width"/>
        <navitem id="calitem" label="Calendar" iconSclass="z-icon-calendar" sclass="notify" tooltip="calpp, position=end_center, delay=0"/>
        <navitem label="Archive Document" iconSclass="z-icon-picture-o" />

        <navitem label="Logout" href="../j_spring_security_logout"  iconSclass="z-icon-home" />



public class SidebarComposer extends SelectorComposer<Component> {

    Hlayout main;
    Div sidebar;
    Navbar navbar;
    Navitem calitem;
    A toggler;
    Vlayout contentparent;
    Include content;

    public void doAfterCompose(Component comp) throws Exception {

    @Listen("onClick = #calitem")
    public void menuList(){
            try {
        }catch(Exception e){
            System.out.println("Error Btn Clicked, " +e);

Advice me to achive to correct way.

Thanks Prem

delete flag offensive retag edit


@justinFrost - Thank you very much for your response. @MDuchemin - Thank you so much for your guidence. The link you given is very useful to achieve my idea.

aswinprem ( 2017-06-29 08:04:09 +0800 )edit

2 Answers

Sort by ยป oldest newest most voted

answered 2017-06-29 07:03:03 +0800

MDuchemin gravatar image MDuchemin
2228 1 5
ZK Team

updated 2017-06-29 07:03:38 +0800

+1 on Justin answer, you can't @Wire a component above the component on which your composer is applied

<div id="comp1">
 <div apply="MyComposer">
   <div id="comp2">

You can wire component comp2, but not component comp1 from MyComposer

Depending on your include mode, setting a composer on a higher element can work. If that's not an option, you could also fire events from the inner composer to an outer composer (see the ZK Event queues documentation on how to fire events and listen to events from each composer.) https://www.zkoss.org/wiki/ZKDeveloper'sReference/EventHandling/EventQueues

The basic idea is: in outer composer (root level composer), during afterCompose, create an event listener on a desktop scope event queue of your choice. In the inner composer, when relevant, fire an event with the relevant data in the same event queue.

link publish delete flag offensive edit

answered 2017-06-29 05:25:07 +0800

JustinFrost gravatar image JustinFrost
145 1 6

The #content include is not in the Sidebar.zul, so you cannot wire it in there.

You need to handle the wiring of the components at the level above by adding the composer to the hlayout, then you can wire in the #content include.

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

1 follower



Asked: 2017-06-28 21:26:22 +0800

Seen: 40 times

Last updated: Jun 29 '17

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