[Wicket-ja-user 208] RE: Re: 列、行ともに可変の縦横に伸びる表について

Back to archive index

古川 烈 r_f_315****@hotma*****
2008年 8月 11日 (月) 13:30:12 JST


古川です、
謝辞が遅くなり申し訳ございません。

沖野様にご教示頂いたコードで理解できました。
ありがとうございました。

DataTableを飛ばしていきなりAjaxFallbackDefaultDataTableを見に行ったのがまずかったです。
ちゃんとコードを追うべきでした。。。

DataTableのコードを眺めていて思ったのですが、
基本的にこのコードはWicketの拡張性の提示であって実際これをそのまま使うのは無理なような気がしました。
もしも本格的にこのモデルでやりたければ自分でマネをして作りなさいね?という感じですかね。

後思ったのは自分個人としてはプログラム内部で整理されているのは好きですが、
DataTableを使うとデザイン上ではテーブルタグ一つになってしまいデザイナーとの連携が取りにくいように思いました。

そこでデザイナーとの連携も考慮すると下記ぐらいが落としどころかと思ったのですが、
沖野様はどう思われますか?

<table>

    <thead>
        <tr>
            <wicket:container wicket:id="headList">
                <th wicket:id="headCells">
                     <span wicket:id="data">
                        繰り返し見出し1
                    </span>
                </th>
            </wicket:container>
            <wicket:remove>
                <th>
                    デザイン見出し2
                </th>
                <th>
                    デザイン見出し3
                </th>
            </wicket:remove>
        <tr>
    </thead>

    <tbody>
        <wicket:container wicket:id="bodyList">
            <tr>
                <td wicket:id="bodyCells">
                    <span wicket:id="data">
                        繰り返しデータ1−1
                    </span>
                </td>
                <wicket:remove>
                    <td>
                        デザインデータ1−2
                    </td>
                    <td>
                        デザインデータ1−3
                    </td>
                </wicket:remove>
            </tr>
            <wicket:remove>
                <tr>
                    <td>
                        デザインデータ2−1
                    </td>
                    <td>
                        デザインデータ2−2
                    </td>
                    <td>
                        デザインデータ2−3
                    </td>
                </tr>
            </wicket:remove>
        </wicket:container>
    </tbody>

</table>


> Date: Wed, 6 Aug 2008 13:15:33 +0900
> From: shiny****@gmail*****
> To: wicke****@lists*****
> Subject: [Wicket-ja-user 203] Re:	列、行ともに可変の縦横に伸びる表について
> 
> 沖野です。
> 
> DataTableはコンストラクタに渡すIColumnの配列数が、列の数になります。
> そこを変えればプログラム側で列の数を変えられます。
> そして、IColumnのpopulateItemメソッドで、1レコードの出力内容が制御できます。実際にはPropertyColumnやAbstractColumnを使うと思います。
> 
> 元のテーブルを実装するとこのような感じになります。
> public class ProductPage extends WebPage {
>   /**
>    * 製品クラス
>    */
>   private static class Product implements Serializable {
>     /** 名前 */
>     private String name;
>     /** 特長 */
>     private List<String> featrueList;
> 
>     public Product(String name, String feature1, String feature2) {
>       this.name = name;
>       this.featrueList = new ArrayList<String>();
>       featrueList.add(feature1);
>       featrueList.add(feature2);
>     }
>     public String getName() {
>       return name;
>     }
>     public List<String> getFeatrueList() {
>       return featrueList;
>     }
>   }
> 
>   /** 製品リスト */
>   public static final List<Product> PRODUCT_LIST = new ArrayList<Product>() {
>     {
>       add(new Product("商品 1", "AAA", "あああ"));
>       add(new Product("商品 2", "BBB", "いいい"));
>     }
>     };
> 
>     public ProductPage() {
>       List<IColumn> columns = new ArrayList<IColumn>();
>       columns.add(new PropertyColumn(new Model("商品名"), "name"));
> 
>    //特長分の列を追加
>       for (int i = 0; i < 2; i++) {
>         final int index = i;
>         columns.add(new AbstractColumn(new Model("特長"+
> Integer.toString(i + 1))){
>           @Override
>           public void populateItem(Item cellItem, String componentId,	
>                                                  IModel rowModel) {
>             Product product = (Product) rowModel.getObject();
>             cellItem.add(new Label(componentId,
> product.getFeatrueList().get(index)));
>           }
>         });
>       }
> 
>       SortableDataProvider provider = new SortableDataProvider() {
>         @Override
>         public Iterator iterator(int first, int count) {
>           return PRODUCT_LIST.iterator();
>         }
> 
>         @Override
>         public IModel model(Object object) {
>           return new Model((Serializable) object);
>         }
> 
>         @Override
>         public int size() {
>           return PRODUCT_LIST.size();
>         }
>       };
> 
>       DataTable dataTable = new DataTable("table", (IColumn[]) columns
>              .toArray(new IColumn[columns.size()]), provider,
> PRODUCT_LIST.size());
> 
>       dataTable.addTopToolbar(new HeadersToolbar(dataTable, provider));
> 
>       add(dataTable);
>     }
> }
> 
> htmlはこれだけです。
> <body>
> <table wicket:id="table">
> </table>
> </body>
> 
> これでヘッダ行も含めて
> ━━━━━━━━━━
> 商品名┃特長1┃特長2
> ━━━━━━━━━━
> 商品 1┃ AAA ┃あああ.
> ━━━━━━━━━━
> 商品 2┃ BBB ┃ いいい
> ━━━━━━━━━━
> が出力されます。
> 
> もっと複雑な行単位で列の数が可変でcolspanで結合するようなテーブルは扱えないですが、普通の用途には充分だと思います。
> 
> -- 
> 沖野信也
> shiny****@gmail*****
> 
> _______________________________________________
> Wicket-ja-user mailing list
> Wicke****@lists*****
> http://lists.sourceforge.jp/mailman/listinfo/wicket-ja-user

_________________________________________________________________
2008年8月 暑い夏を快適に過ごす裏ワザ。MSN相談箱で探してみよう!
http://questionbox.jp.msn.com/search.php3?StatusCheck=ON&search_type=word&kw=%8F%8B%82%B3%91%CE%8D%F4
-------------- next part --------------
HTMLの添付ファイルを保管しました...
Download 


Wicket-ja-user メーリングリストの案内
Back to archive index