Suggested case list:

Disabled list item row passed to VM-1981

296fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:44 PMlink

Disabled list item row passed to VM-1981

295fatih123160.83.36.13025nk0uiFeb 13, 2018 4:25:16 PMlink

Disabled list item row passed to VM-1981

294fatih123160.83.36.13225nk0uiFeb 13, 2018 3:30:44 PMlink

grid sample with ListModel/RowRenderer

816guest80.82.2.1312vah9ajFeb 21, 2017 11:42:21 AMlink

grid sample with ListModel/RowRenderer

809guest175.98.113.1622vah9ajJan 26, 2017 9:19:33 AMlink

grid sample with ListModel/RowRenderer

196guest79.185.142.402vah9ajApr 26, 2014 10:53:57 PMlink

grid sample with ListModel/RowRenderer

195guest79.185.142.402vah9ajApr 26, 2014 10:53:54 PMlink

grid sample with ListModel/RowRenderer

194guest79.185.142.402vah9ajApr 26, 2014 10:53:51 PMlink

grid sample with ListModel/RowRenderer

193guest79.185.142.402vah9ajApr 26, 2014 10:53:48 PMlink

grid sample with ListModel/RowRenderer

192guest79.185.142.402vah9ajApr 26, 2014 10:53:44 PMlink

grid sample with ListModel/RowRenderer

191guest79.185.142.402vah9ajApr 26, 2014 10:53:40 PMlink

Hierarchy table without using ZK PE/EE

1aaknai151.28.135.2131s871daJul 29, 2013 11:02:46 PMlink

grid sample with ListModel/RowRenderer

128aaknai151.28.135.2132vah9ajJul 29, 2013 7:20:00 PMlink

user model to move item to another listbox

1TonyQ114.25.109.94d0n3krApr 21, 2012 10:43:27 AMlink

Using timer to refresh a grid

1TonyQ220.133.44.3725nk0uiFeb 17, 2012 3:17:34 AMlink

Fire a event from child iframe

1TonyQ220.133.44.372eupjotFeb 3, 2012 5:04:52 AMlink

Textbox input restriction sample

1TonyQ72.21.245.2431b3nlr0Dec 20, 2011 10:09:10 AMlink

Test web core taglib in ZUL

1TonyQ198.203.175.175ofqkemDec 17, 2011 3:36:08 AMlink

identify firefox or not in server side

1TonyQ198.203.175.1751nv2qreDec 10, 2011 4:25:04 AMlink

ZK addThis integration

1TonyQ198.203.175.1751apl96jNov 5, 2011 4:12:50 AMlink

Latest 10 Fiddles :

Command on custom event

17guest118.232.105.181qpuidaAug 23, 2019 9:20:47 AMlink

Command on custom event

16guest118.232.105.181qpuidaAug 23, 2019 9:20:24 AMlink

Command on custom event

15guest118.232.105.181qpuidaAug 23, 2019 9:19:46 AMlink

Command on custom event

14guest118.232.105.181qpuidaAug 23, 2019 9:19:11 AMlink

Command on custom event

13guest118.232.105.181qpuidaAug 23, 2019 9:07:02 AMlink

Busy indicator appears on opened modal

4guest202.53.12.422jj2p1oAug 23, 2019 7:31:35 AMlink

Icon and Label Button

1guest212.186.131.2043251pmoAug 23, 2019 7:08:17 AMlink

Another new ZK fiddle

5guest181.48.10.24231u9e3aAug 22, 2019 9:18:17 PMlink

Another new ZK fiddle

4guest181.48.10.24231u9e3aAug 22, 2019 9:04:44 PMlink

Another new ZK fiddle

3guest181.48.10.24231u9e3aAug 22, 2019 8:38:04 PMlink

MVC Tutorial Demo

1guest203.193.148.992j476bcFeb 12, 2019 11:56:17 AMlink


index.zulzul<window title="Search" width="600px" border="normal" apply="pkg$.SearchController"> <hbox align="center"> Keyword: <textbox id="keywordBox" /> <button id="searchButton" label="Search" image="" /> </hbox> <listbox id="carListbox" emptyMessage="No car found in the result" height="160px" style="margin-top:10px"> <listhead> <listheader label="Model" /> <listheader label="Make" /> <listheader label="Price" width="20%"/> </listhead> <template name="model"> <listitem> <listcell label="${each.model}"></listcell> <listcell label="${each.make}"></listcell> <listcell>$<label value="${each.price}" /></listcell> </listitem> </template> </listbox> <hbox style="margin-top:20px" id="detailBox" visible="false"> <image id="previewImage" style="padding:10px" /> <vbox> <hlayout> Model : <label id="modelLabel" style="font-weight:bold"/> </hlayout> <hlayout> Make : <label id="makeLabel" style="font-weight:bold"/> </hlayout> <hlayout> Price : <span>$<label id="priceLabel" style="font-weight:bold"/></span> </hlayout> <label id="descriptionLabel" /> </vbox> </hbox> </window> SearchController.javajavaimport java.util.List; import org.zkoss.zk.ui.Component; import; import; import; import org.zkoss.zul.Image; import org.zkoss.zul.Label; import org.zkoss.zul.ListModelList; import org.zkoss.zul.Listbox; import org.zkoss.zul.Textbox; public class SearchController extends SelectorComposer<Component> { private static final long serialVersionUID = 1L; @Wire private Textbox keywordBox; @Wire private Listbox carListbox; @Wire private Label modelLabel; @Wire private Label makeLabel; @Wire private Label priceLabel; @Wire private Label descriptionLabel; @Wire private Image previewImage; @Wire private Component detailBox; private CarService carService = new CarServiceImpl(); @Listen("onClick = #searchButton") public void search(){ String keyword = keywordBox.getValue(); List<Car> result =; carListbox.setModel(new ListModelList<Car>(result)); } @Listen("onSelect = #carListbox") public void showDetail(){ detailBox.setVisible(true); Car selected = carListbox.getSelectedItem().getValue(); previewImage.setSrc(selected.getPreview()); modelLabel.setValue(selected.getModel()); makeLabel.setValue(selected.getMake()); priceLabel.setValue(selected.getPrice().toString()); descriptionLabel.setValue(selected.getDescription()); } } Car.javajava/** Car Bean **/ public class Car { private Integer id; private String model; private String make; private String preview; private String description; private Integer price; public Car() { } public Car(Integer id, String model, String make, String description, String preview, Integer price) { = id; this.model = model; this.make = make; this.preview = preview; this.description = description; this.price = price; } public Integer getId() { return id; } public void setId(Integer id) { = id; } public String getMake() { return make; } public void setMake(String make) { this.make = make; } public String getPreview() { return preview; } public void setPreview(String preview) { this.preview = preview; } public String getDescription() { return description; } public void setDescription(String description) { this.description = description; } public Integer getPrice() { return price; } public void setPrice(Integer price) { this.price = price; } public String getModel() { return model; } public void setModel(String model) { this.model = model; } }CarService.javajavaimport java.util.List; public interface CarService { /** * Retrieve all cars in the catalog. * @return all cars */ public List<Car> findAll(); /** * search cars according to keyword in name and company. * @param keyword for search * @return list of car that match the keyword */ public List<Car> search(String keyword); }CarServiceImpl.javajava import java.util.LinkedList; import java.util.List; public class CarServiceImpl implements CarService{ //data model private List<Car> carList= new LinkedList<Car>(); private int id = 1; //initialize book data public CarServiceImpl() { carList.add( new Car(id++, "Primera", "Nissan", "The Nissan Primera was produced between 2002 and 2008. It was available as a 4-door sedan or a 5-door hatchback or estate."+ " The entry-level 1.6-liter petrol feels underpowered for a large car. The 1.8-liter petrol is keen, the refined 2.0-liter unit is the star performer. An improved 2.2-liter turbodiesel performs well, but is only relatively economical, as it's competitors in this class with similar characteristics offer even lower fuel consumption.", "", 23320)); carList.add( new Car(id++, "Cefiro", "Nissan", "The Nissan Cefiro is an intermediate-size automobile range sold in Japan and other countries. It was available only as a 4 door sedan. A large proportion were equipped with automatic transmissions. Originally marketed towards the Japanese salaryman the top model used the same engine as found in the R32 Nissan Skyline, a 2 litre turbo charged 6 cylinder engine capable of just over 200 hp (150 kW). Other variants came with other versions of the Nissan RB engine. Brand new, the Cefiro was slightly more expensive than the equivalent Nissan Skyline.", "", 38165)); carList.add( new Car(id++, "Camry", "Toyota", "The Toyota Camry is a midsize car manufactured by Toyota in Georgetown, Kentucky, USA; as well as Australia; and Japan. Since 2001 it has been the top selling car in the United States.The Holden equivalents were not successful even though they came from the same factory as the Camry. Since 2000 Daihatsu has sold a Camry twin named the Daihatsu Altis. The name comes from the English phonetic of the Japanese word \"kan-muri,\" which means \"crown.\"", "", 24170)); carList.add( new Car(id++, "Century", "Toyota", "The Toyota Century is a large four-door limousine produced by Toyota mainly for the Japanese market. Production of the Century began in 1967 and the model received " + "only minor changes until redesign in 1997. This second-generation Century is still sold in Japan. The Century is produced in limited numbers and is built " + "in a \"nearly hand-made\" fashion. It is often used by royalty, government leaders, and executive businessmen. Although the Century is not exported outside Japan in large numbers, it is used frequently by officials stationed in overseas Japanese offices. In contrast to other luxurious cars (such as the Maybach or a Rolls Royce), the Century has not been positioned and marketed as a sign of wealth or excess. Instead, the Century projects an image of conservative achievement.", "", 28730)); carList.add( new Car(id++, "Sigma", "Mitsubishi", "The third-generation of Japanese car Mitsubishi Galant, dating from 1976, was divided into two models: the Galant Sigma (for the sedan and wagon) and the Galant Lambda (the coupe). The former was sold in many markets as the Mitsubishi Galant (without the word 'Sigma') and in Australia as the Chrysler Sigma (until 1980, after which it became the Mitsubishi Sigma). Strangely, in New Zealand it was badged as 'Galant Sigma' but colloquially referred to as the 'Sigma', a name it formally adopted after 1980.", "", 54120)); carList.add( new Car(id++, "Challenger", "Mitsubishi", "The Mitsubishi Challenger, called Mitsubishi Pajero Sport in most export markets, Mitsubishi Montero Sport in Spanish-speaking countries (including North America), Mitsubishi Shogun Sport in the UK and Mitsubishi Nativa in Central and South Americas (the Challenger name was also used in Australia), is a medium sized SUV built by the Mitsubishi Motors Corporation. It was released in 1997, and is still built as of 2006, although it's no longer available in its native Japan since the end of 2003.", "", 58750)); carList.add( new Car(id++, "Civic", "Honda", "The eighth generation Honda Civic is produced since 2006. It is available as a coupe, hatchback and sedan. Models produced for the North American market have a different styling."+ " At the moment there are four petrol engines and one diesel developed for this car. The 1.4-liter petrol is more suitable for the settled driving around town. The 1.8-liter petrol, developing 140 hp is a willing performer. The 2.2-liter diesel is similar to the Accord's unit. It accelerates rapidly and is economical as well. The Honda Civic is also available with a hybrid engine. In this case engine is coupled with an automatic transmission only. The 2.0-liter model is available with the paddle shift gearbox.", "", 17479)); carList.add( new Car(id++, "New Beetle", "Volkswagen", " The Volkswagen Beetle is produced since 1998. It is available as a coupe or convertible."+ " The VW Beetle is powered by a wide range of engines, including two 1.9-liter turbodiesels, and turbocharged 1.8-liter petrol. There is also a 3.2-liter RSI available for the range topper."+ " The new Beetle has nothing in common with the rear-engined original, except the 'retro' design. It is based on the VW Golf and has the same solid build quality.", "", 67540)); carList.add( new Car(id++, "Golf V", "Volkswagen", "The Volkswagen Golf V is produced since 2003. There is a wide range of fine and reliable engines. The best choice would be 1.6-liter FSI direct injection petrol with 115 hp or 2.0-liter turbodiesel with 150 hp. The last mentioned features an outstanding fuel economy for it's capacity and acceleration speed, although is a bit noisy. The strongest performer is a 2.0-liter GTI, delivering 200 hp, which continues the Golf's hot hatch traditions."+ " Steering is sharp. The car is stable at speed and easily controlled as the power steering gets weightier with speed, unfortunately it does not give enough feedback to the driver. The ride is a bit firm in town, as the reliability of suspension was preferred to the comfort. It is a common feature of all VW Golf's.", "", 78200)); carList.add( new Car(id++, "Neon", "Chrysler", " This car is sold as the Dodge Neon in the United States and as Chrysler Neon for export only. It is a second generation Neon produced since 2000."+ " There is a choice of three petrol engines. The basic 1.6-liter petrol is the same unit found on the MINI. The top of the range is a 2.0-liter engine, providing 133 hp, besides acceleration is a weak point of all Neons.", "", 85400)); } public List<Car> findAll(){ return carList; } public List<Car> search(String keyword){ List<Car> result = new LinkedList<Car>(); if (keyword==null || "".equals(keyword)){ result = carList; }else{ for (Car c: carList){ if (c.getModel().toLowerCase().contains(keyword.toLowerCase()) ||c.getMake().toLowerCase().contains(keyword.toLowerCase())){ result.add(c); } } } return result; } }