|
Processing...
Description & Source Code
The Auto Paging feature determines the page size based on
the dynamic height of the Grid component; ridding developers the need to
specify the page size for the auto_paging.zul
<panel id="container" height="400px" apply="demo.grid.auto_paging.AutoPagingController">
<panelchildren>
<grid id="demoGrid" mold="paging" pagingPosition="both"
model = "${$composer.allPurchases}"
autopaging="true" vflex="true">
<columns>
<column width="80px" label="Order #" align="left" />
<column label="Item Purchased" align="center" />
<column label="Purchased Time" align="center" />
<column width="80px" label="Paid" align="center" />
</columns>
<template name="model">
<row>
<label value="${each.id}" />
<label value="${each.item}" />
<timebox value="${each.time}"
disabled="true" cols="12" format="a hh:mm:ss" mold="rounded" />
<checkbox checked="${each.paid}" disabled="true"/>
</row>
</template>
</grid>
</panelchildren>
</panel>auto_paging_config.zul
<zk>
<zscript><![CDATA[
void changeHeight(String height){
container.height = height;
}
void changeMold(String mold){
demoGrid.pagingChild.mold = mold;
}
]]></zscript>
<vlayout>
<radiogroup onCheck="changeHeight(self.selectedItem.label)">
<vlayout>
<label value="Select Container's Height"/>
<radio label="200px" />
<radio label="300px" />
<radio label="400px" checked="true" />
<radio label="500px" />
<radio label="600px" />
</vlayout>
</radiogroup>
</vlayout>
<separator height="10px"/>
<radiogroup onCheck="changeMold(self.selectedItem.label)">
<vlayout>
<label value="Select a Mold for the Paging:"/>
<radio label="default" checked="true" />
<radio label="os" />
</vlayout>
</radiogroup>
</zk>AutoPagingController.java
package demo.grid.auto_paging;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zul.ListModelList;
import demo.data.Purchase;
import demo.data.PurchaseData;
public class AutoPagingController extends SelectorComposer<Component>{
private static final long serialVersionUID = 1L;
private PurchaseData data = new PurchaseData();
private ListModelList<String> availableItems;
public AutoPagingController(){
availableItems = new ListModelList<String>(data.getAvailableItems());
}
public ListModelList<Purchase> getAllPurchases() {
return new ListModelList<Purchase>(data.getAllPurchases());
}
public ListModelList<String> getAvailableItems() {
return availableItems;
}
}
PurchaseData.java
package demo.data;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;
import java.util.Random;
public class PurchaseData {
private final List<String> availableItems = new ArrayList<String>();
private List<Purchase> allPurchases = new ArrayList<Purchase>();
private int TOTAL_PURCHASES = 25;
private Random randomGenerator = new Random();
public PurchaseData() {
availableItems.add("Java");
availableItems.add("Latte");
availableItems.add("Lungo");
availableItems.add("Macchiato");
availableItems.add("Mocha");
generatePurchases();
}
public List<Purchase> getAllPurchases() {
return this.allPurchases;
}
public List<String> getAvailableItems() {
return availableItems;
}
private void generatePurchases() {
for(int i=0; i<TOTAL_PURCHASES; i++) {
int id = (i + 101);
String purchasedItem = availableItems.get(randomGenerator.nextInt(availableItems.size()));
Date randomDate = new Date(Math.abs(System.currentTimeMillis() - randomGenerator.nextInt(1000000)));
boolean paid = randomGenerator.nextBoolean();
allPurchases.add(new Purchase(id, purchasedItem, randomDate, paid));
}
}
}
Purchase.java
package demo.data;
import java.util.Date;
public class Purchase {
private int id;
private String item;
private Date time;
private boolean paid;
public Purchase(int orderId, String orderItem, Date purchaseTime, boolean paid) {
this.id = orderId;
this.item = orderItem;
this.time = purchaseTime;
this.paid = paid;
}
public int getId() {
return id;
}
public void setId(int orderId) {
this.id = orderId;
}
public String getItem() {
return item;
}
public void setItem(String orderedItem) {
this.item = orderedItem;
}
public Date getTime() {
return time;
}
public void setTime(Date purchaseTime) {
this.time = purchaseTime;
}
public boolean isPaid() {
return paid;
}
public void setPaid(boolean paid) {
this.paid = paid;
}
}
Copyright © 2005-2025 Potix Corporation All rights reserved.
|
|
Processing... |