Wicket で表(グリッド)表示で、画面操作で選択行の背景色を切り替えることをする場合、
Wicket で配布する Example に方法が示されている。
しかしこのサンプルでは、<a>タグ、<a href="#" wicket:id="toggleHighlite"> である為自動的にページリフレッシュが掛かる。
チェックボックスの ON/OFF で行う場合は、代わりに setResponsePage を使うことで
同様に実現できた。
DataView生成で、populateItem のオーバライドだけでなく
org.apache.wicket.markup.repeater.RefreshingView
の newItem をオーバーライドする。
DataView<Paper> view = new DataView<Paper>("view",provider,10){
@Override
protected void populateItem(final Item<Paper> item){
item.add(new AjaxCheckBox("flg",new Model<Boolean>()){
@Override
protected void onUpdate(AjaxRequestTarget ajaxrequesttarget){
Paper selectPaper = item.getModelObject();
// チェックボックス onoff の度にこのメソッドが実行されるので
// ここで、選択 ON/OFF を別途用意するオブジェクトに登録更新する!
// 選択行の背景色の切替
HighlitableDataItem<Paper> hitem = (HighlitableDataItem<Paper>)item;
hitem.toggleHighlite();
/*** ページリフレッシュ 自ページを指定 ***/
setResponsePage(PickHighlitePage.this);
}
});
}
@Override
protected Item<Paper> newItem(String id,int index,IModel<Paper> model){
return new HighlitableDataItem<Paper>(id,index,model);
}
};
/*** Model 再利用 を定義する!***/
view.setItemReuseStrategy(ReuseIfModelsEqualStrategy.getInstance());
--------- 以下、背景色切替の処理クラスを定義する ----------
static class HighlitableDataItem<T> extends Item<T>{
boolean highlite = false;
public HighlitableDataItem(String id,int index,IModel<T> model){
super(id,index,model);
add(new AttributeModifier("style",true,new Model<String>("background-color:#80b6ed;")){
@Override
public boolean isEnabled(Component component){
return HighlitableDataItem.this.highlite;
}
});
}
public void toggleHighlite(){
this.highlite = !this.highlite;
}
}
このクラスも、コンストラクタで色を指定すれば良いかもしれない。
public HighlitableDataItem(String id,int index,IModel<T> model,String rgbHex){
super(id,index,model);
add(new AttributeModifier("style",true,new Model<String>("background-color:#"+rgbHex+";")){
@Override
public boolean isEnabled(Component component){
return HighlitableDataItem.this.highlite;
}
});
}