Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hi All,
I have a ListModel which contains a list of beans with a urlPath attribute containing different URL path of some images. I have dao implementation to grep all details from the database and then create the list model as at below:
Code: Skipped some coding for convenience reading
Java:
private int selectedCategory = 0;
public ListModel<ImageBean> getImageListModel() {
List<ImageBean> imageList = new ArrayList<ImageBean>();
ResultSet rs = HANDLER.execute("select * from image where category = " + selectedCategory + ";");
while (rs.next()) {
ImageBean imageBean = new imageBean(rs.getInt("image_id"), rs.getString("url"));
imageList.add(imageBean);
}
return new ListModelList<ImageBean>(imageList);
}
ZUL:
<zk>
<borderlayout apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('com.album.core.ZULControllers.IPhoneIndexController')">
....
<div id="container" width="100%">
<zk forEach="${vm.imageListModel}">
<image src="images/signals/${each.url}" />
</zk>
</div>
....
I have created different buttons and binded them to an action method by using annotation, i.e.
@NotifyChange({ "imageListModel" })
@Command
public void updateCategory(@BindingParam("category_id") int category_id) {
selectedCategory = category_id;
}
The problem is when I click the button, the screen does not refresh to show the corresponding images. Please kindly advise what I missed or used incorrectly.
May I ask if you meant the one below; I uses ListModel since I want to see if the underlying methods, binding and MVVM are working fine.
package com.stockta.core.beans.zul;
public class ImageBean {
private int id = 0;
private String url = "";
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
}
Grid works just perfect. But since I need to display images in sequence instead of rows, I need to utilise the foreach approach. Below please find the code for Grid approach I tested:
<grid id="imageGrid" model="@bind(vm.imageListModel)" autopaging="true" mold="paging" pageSize="10">
<columns sizable="true">
<column label="Images" align="center" />
</columns>
<template name="model">
<row>
<cell >
<image src="images/signals/${each.url}.jpg" />
</cell>
</row>
</template>
</grid>
wat fqn is the ImageBean so I can search the docs for that, its strange that he see's with the iteration over the loop a String in stead of ImageBean (try the List back in stead of a ListModelList. If it is needed zk will do that automaticly for you but the foreach doesn't need a ListModelList)
chillworld ( 2014-04-09 05:57:48 +0800 )editController Code:
private List<ImageBean> imageList = new ArrayList<ImageBean>();
public List<ImageBean> getImageList() {
return imageList;
}
public ListModel<ImageBean> getImageListModel() {
getImageList().clear();
String sql = "select * from image where category = #CATEGORY#";
sql = sql.replaceAll("#CATEGORY#", getCategorString());
//getCategorString() will return a textbox value when action is fired
QueryHandler qh = new QueryHandler(this.getClass().getName());
qh.setSql(sql);
ResultSet rs = qh.perform();
try {
while (rs.next()) {
ImageBean imageBean = new ImageBean(rs.getInt("id"), rs.getString("url"));
getImageList().add(imageBean);
}
rs.close();
} catch (SQLException e) {
e.printStackTrace();
}
qh.disconnect();
return new ListModelList<ImageBean>(getImageList());
}
@NotifyChange({ "imageListModel" })
@Command
public void updateImage(@BindingParam("category") String category) {
setCategorString(category);
}
The imageListModel is a ListModel object containing a list of <imagebean> with an attribute (i.e. url) inside. After removing the .url, error message was gone but no image was showed. Not sure if it is relevant to remove the .url since the image src value is stored in the url field in the <imagebean> bean.
I tested the code using the @load approach and it is generating issue. In summary:
My original approach where data is shown properly, just not being refreshed after firing an action:
<div id="container" width="100%">
<zk forEach="${vm.imageListModel}">
<image src="images/signals/${each.url}" />
</zk>
</div>
The new approach using @load where I have got the compilation error while visiting the page:
<div id="container" width="100%">
<zk forEach="@load(vm.imageListModel)">
<image src="images/signals/${each.url}" />
</zk>
</div>
Error message: Property 'url' not found on type java.lang.String
Please kindly advise ^.^
Hi Greetz,
May I ask if you meant:
<zk forEach="@load(vm.imageListModel)" var="item">
<image src="images/signals/@load(item.signalname).jpg" />
</zk>
Not so simple anymore. I Found the right way to use here :
http://books.zkoss.org/wiki/ZKDeveloper'sReference/MVVM/Advanced/BindinginSpecialAttribute#The.22forEach.22VersusChildren_Binding
<div children="@load(vm.imageListModel)">
<template name="children">
<checkbox label="images/signals/${each.url}.jpg" />
</template>
</div>
note : if the ${each.url} doesn't work we need to use EL expresions.
Like this :
<?taglib uri="http://www.zkoss.org/dsp/web/core" prefix="c"?>
<div children="@load(vm.imageListModel)">
<template name="children">
<checkbox label="@load(c:cat3('images/signals/',each.url,'.jpg'))" />
</template>
</div>
greetz chill
Asked: 2014-04-04 09:27:48 +0800
Seen: 50 times
Last updated: Apr 09 '14