Skip to Content
author's profile photo Former Member
0
Former Member

handle event from listbox's listcell button/image etc.

Posted on Dec 03, 2014 at 12:11 PM 144 Views

Hi, I have a code like this in a zul file:

 <listbox>        
                     <listitem>                        
                         <listcell tooltip="tooltip${each.code}">
                             <popup id="tooltip${each.code}">                            
                                  <image src="...remove.gif">
                                      <custom-attributes targetDto="${each}"/>
                                  </image>                                
                                       </popup>
                         </listcell>
                         <listcell label="${each.name}"/>                            
                     </listitem>                    
                 </template>
 </listbox>

I want to handle the click on the "image", remove some stuff and then refresh the listbox. I know one way to do this is to have a custom renderer for the whole listbox and then addListener on the image. Is there other way to do it, for example to use forward like:

 forward="onClick=onRemoveImageClick"?

Or even directly call a method of the widget's controller/composer:

 onClick="widgetControllerBean.removeThing()"
Add a comment
10|10000 characters needed characters exceeded

Assigned Tags

Related questions

2 Answers

  • Best Answer
    author's profile photo Wojciech Gruszczyk
    Wojciech Gruszczyk
    Posted on Dec 03, 2014 at 12:36 PM
    1

    Hi,

    there are a few things:

    • we discourage using MVVM while it turned out to have performance issues for more complex widgets

    • if you want to use MVVM declare the controller:

    <controller class="my.apckage.MyController" id="myModel"/>

    • now you can access the Controller via myModel vairable

    • use onClick="@command('someMethod')" to trigger methods on the controller; the methods must be annotated with org.zkoss.bind.annotation.Command

    Cheers, Wojtek

    Add a comment
    10|10000 characters needed characters exceeded

    • Former Member Wojciech Gruszczyk
      Dec 04, 2014 at 09:46 AM

      This I already tried:), but @ViewEvent expects componentId and if I omit it then event.getTarget() is the parent widget and event.getData() is null. I tried like this on the controller: @ViewEvent(eventName = Events.ON_CLICK) public void onClickAny(final Event event)

    Comment on This Answer
  • author's profile photo Former Member
    Former Member
    Posted on Dec 04, 2014 at 03:24 PM
    0

    This is what worked for me:

                 <listbox id="listboxId" >
           <template name="model">                   
                 <listitem>                        
                     <listcell tooltip="tooltip${each.code}">
                         <popup id="tooltip${each.code}">                                 
                              <image src="...remove.gif" forward="onClick=listboxId.onDeleteSomething"/>
                                  </popup>
                            </listcell>
                              <listcell label="${each.name}"/>                                                    
                  </listitem>                    
             </template>
         </listbox>

    On the controller:

     @ViewEvent(componentID = "listboxId", eventName = "onDeleteSomething")
 public void listboxOnDelete(final ForwardEvent event)
    Add a comment
    10|10000 characters needed characters exceeded

Before answering

You should only submit an answer when you are proposing a solution to the poster's problem. If you want the poster to clarify the question or provide more information, please leave a comment instead, requesting additional details. When answering, please include specifics, such as step-by-step instructions, context for the solution, and links to useful resources. Also, please make sure that you answer complies with our Rules of Engagement.
You must be Logged in to submit an answer.

Up to 10 attachments (including images) can be used with a maximum of 1.0 MB each and 10.5 MB total.