【ZK】資料庫應用

本篇範例將介紹在一個以 ZK 為基礎的 UI 下，讀取資料庫並顯示結果在 UI 上

首先先介紹 ZK 長用於顯示資料的 listbox 元件，如下圖

通常一個顯示資料的元件 listbox 來有包含兩個子元件 listhead、listitem

顧名思義 listhead 就是顯示最上面顯示欄位名稱的地方 listitem 則是顯示每筆資料的元件

<listbox id="box" multiple="true" rows="10" >

        <listhead>

            <listheader label="countryID"/>

            <listheader label="locationNO" />

            <listheader label="locationName" />

            <listheader label="countryName" />

        </listhead>

        <listitem>

            <listcell />

            <listcell />

            <listcell />

            <listcell />

        </listitem>

</listbox>   

接下來介紹一下存取的資料模型和DAO

Country.java

package org.pojo;

public class Country 
{
    private int id;
    private String location_no;
    private String location_name;
    private String country_name;

    //省略getter&setter
}

CountryDao.java

package org.dao;

import java.util.List;
import org.pojo.Country;
public interface CountryDao 
{
    public List getAllCountry();
}

CountryDaoImpl.java

package org.dao.impl;

import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;

import org.dao.CountryDao;
import org.pojo.Country;
import org.tools.DBOperator;
public class CountryDaoImpl implements CountryDao
{
    private DBOperator dboperator; //DBOperator 是獨立出來的有關於所有的 JDBC 操作
        public CountryDaoImpl(){
        dboperator = new DBOperator();
        dboperator.getConnection();
    }
 
    public List getAllCountry(){
        dboperator.getConnection();
        dboperator.exceuteQueUpd("SELECT * FROM t_country", new Object[]{});
        List list = null;
  
 try{
            Country country = null;
            list = new ArrayList();
            ResultSet result = dboperator.getResult();
            while(result.next()){
                country = new Country();
                country.setId(result.getInt("country_id"));
                country.setLocation_no(result.getString("location_no"));
                country.setLocation_name(result.getString("location_name"));
                country.setCountry_name(result.getString("country_name"));
                list.add(country);
            }
        }catch(Exception e){
            System.out.println(e.getMessage());
        }finally{
            dboperator.close();
        }
        return list;
    }
}

到這邊 資本的資料存取部分已經準備完成 UI 也有了初步的架構，接著就可以進行資料讀取的第一步

首先在 showdata.zul 中加入以下這行,已對目前這頁觸發 Data Binding 的機制

<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit"?>

接著在 window 標籤將上 apply 屬性以連結一個 Controller

<window id="win" title="Get data from DB" border="normal"

        apply="org.controller.DataHandleController" >

而不外乎的，這個 Controller 就是替這頁來準備資料的，以下來看看源碼

DataHandleController.java

package org.controller;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.dao.CountryDao;
import org.dao.impl.CountryDaoImpl;
import org.pojo.Country;
import org.zkoss.zk.ui.Executions;
import org.zkoss.zk.ui.SuspendNotAllowedException;
import org.zkoss.zk.ui.event.Event;
import org.zkoss.zk.ui.util.GenericForwardComposer;
import org.zkoss.zul.Radiogroup;
import org.zkoss.zul.Window;
//繼承 GenericForwardComposer 
public class DataHandleController extends GenericForwardComposer 
{
    private CountryDao countrydao = new CountryDaoImpl();
 
    public List<Country> getAllCountry(){ 
        return countrydao.getAllCountry();
    }
}

以上這個 Controller 已經將我們要的資料準備好了，那該如何讓 listbox 知道如何去讀取這個資料呢

那又該如何讓資料顯示在 listitem 上??

首先我們先讓 listbox 能夠取得這些 data, 必須在 listbox 上加上 model 屬性，如下所示：

<listbox id="box" multiple="true" rows="10"

             model="@{win$composer.allCountry}">

win 是剛才 window 元件的 id 屬性值 allCountry 則會呼叫到剛剛那個 Controller 的 getAllCountry() 方法

目前就能夠讓 listbox 取得要的資料，而 listitem 呢?　看看以下吧

<listitem self="@{each='country'}" value="country">

        <listcell label="@{country.id}" />　

        <listcell label="@{country.location_no}"/>

        <listcell label="@{country.location_name}"/>

        <listcell label="@{country.country_name}"/>

</listitem>

注意以上的 id、location_no、location_name... 須和最開始定義的 Country model 的屬性相同

下一篇 【ZK】Radiogroup介紹運用 radiogroup 來篩選 listbox 裡的資料