-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hello,
I want to create a listbox that contains a delete button for each row. I implemented the following code does not work because the buttons may not have the ID property because it repeats and skips a failure duplicate ID.
----------- Controller.java -----------
@Wire
private Listbox listboxDocumentos;
@Override
public void doAfterCompose(final Component comp) throws Exception {
final List<DocsBean> docs = docsService.getDocs();
listboxDocumentos.setModel(new ListModelList<DocsBean>(docs));
}
@Listen("onClick = #btnDelete")
public void delete(final Event event) {
// implements
}
----------- listDocs.zul -----------
<listbox id="listboxDocumentos" nonselectableTags="" mold="paging" pageSize="5" multiple="false" >
<listhead>
<listheader label="Nombre" sort="auto" width="42%" />
<listheader label="Version" sort="auto" width="6%"/>
<listheader label="Tamaño" sort="auto" width="7%" />
<listheader label="Tipo" sort="auto" width="8%" />
<listheader label="Usuario" sort="auto" width="20%" />
<listheader label="Fecha" sort="auto" width="12%" />
<listheader label="Action" width="5%" align="center" />
</listhead>
<template name="model">
<listitem id="${each.id}">
<listcell label="${each.nombre}" />
<listcell label="${each.version}" />
<listcell label="${each.tamanyo}" />
<listcell label="${each.formato}" />
<listcell label="${each.nombreUsuario}" />
<listcell label="${each.fechaRegistroFormat}" />
<listcell >
<button id="btnDelete" image="/core/static/css/images/delete-icon.png" />
</listcell>
</listitem>
</template>
</listbox>
Does anyone know how?
Thank you.
You can keep the template-approach in combination with event forwarding:
As you can see in this running example there is no need for an id on each item. As the listbox receives the event (even with a custom/nice name "onDeleteItem") and the item's object is passed to the event listener as the event.getData().
Have fun!
Robert
Hello josefsabater,
You can easily implement it using a Listbox Renderer and adding a event listener to the button as shown below:
http://books.zkoss.org/wiki/ZKDeveloper%27sReference/MVC/View/Renderer/Listbox_Renderer
http://www.zkoss.org/zkdemo/grid/dynamic_renderer
Please let me know if you need more help.
Best Regards,
Darksu
Thank you very much to you both!
The two solutions are correct but I finally used to cor3000 for simplicity.
Greetings!
thanks for help!!!
Asked: 2015-06-05 09:35:20 +0800
Seen: 159 times
Last updated: Jun 19 '15
Getting selected ListBox values on button Click | ZK
Need validation for checkbox, radio, listbox
Problem rendering radio button in IE8
MVVM Radio button with form binding
How to handle big (large) file upload?
Below code from jo.js causes "Invalid object calling" error in IE10. Please provide solution.