I can't get event in button using zk

Question

I'm new using ZK, recently i started a proyect, in my index.zul y charge a listbox with data from db, all of this ok, but the problem is when i try to filter, using a button to search, i can´t get event from this button. There is my simply code .zul and controller.

.zul

<window id="win" apply="test.listbox.composer.ListboxModelRendererComposer">

    <!-- Tested with ZK 6.0.2 -->
    Filtro
    <textbox id="pepito" value="Gar" instant="true"/>
    <button id="saveButton" label="Buscar"></button>

    <div style="margin: 10px;">
        <vbox>
            <label value="Listado de legajos San Fernando" />
            <div height="10px" />
            <listbox id="lbThree" emptyMessage="La busqueda no retorno resultados" />
        </vbox>
    </div>
</window>

public class ListboxModelRendererComposer extends GenericForwardComposer {
Listbox lbThree;
Textbox pepito;
Button saveButton;

@Override
public void doAfterCompose (Component comp) throws Exception {
    super.doAfterCompose(comp);

    // set models and render to listbox after comopsed
    lbThree.setModel(getLegajosModel());

    lbThree.setItemRenderer(new PersonListitemRenderer());
}

public ListModel getSimpleStringModel () {
    List l = new ArrayList();

    // simply add some Strings to a list
    // than wrap the list by a ListModelList
    l.add("data one");
    l.add("data two");
    l.add("data three");

    return new ListModelList(l);
}
public ListModel getLegajosModel () {
    List legajos;

    EntityManagerFactory emf;
    emf = Persistence.createEntityManagerFactory("TestRenderPU");
    EntityManager em = emf.createEntityManager();
    javax.persistence.Query q = em.createQuery("select c from LegLEGAJO as c WHERE c.apellido LIKE :filtro OR c.nombre LIKE :filtro OR c.tipoLegajo LIKE :filtro OR c.legajo LIKE :filtro");
    q.setParameter("filtro", "%" + pepito.getValue() + "%");
    legajos = q.getResultList();
    em.close();

    return new ListModelList(legajos);
}

@Listen(Events.ON_CLICK + " = #saveButton")
public void saveButtonClicked(Event event) {
    alert("Hello!!!");
} 

}

Answer 1

You have 2 ways :

First one :

Extends SelectorComposer

Wiring your components :

Listbox lbThree;
Textbox pepito;
Button saveButton;

Change to :

@Wire
private Listbox lbThree;
@Wire
private Textbox pepito;
@Wire
private Button saveButton;

Second make the correct @Listen :

@Listen("onClick = #saveButton")

Second one :

Keep the GenericForwardComposer :

public void onClick$saveButton(Event event) {
    //...
}

Edit : corrected to @NabilA. comment.