Wicket の TabPanle 画面、AjaxTabbedPanel で、formを使用するには、
親HTML で TabPanel を展開する div タグを form タグ で囲み
親HTML に該当する WebPage で Form コンポーネントを構築する必要がある。
----- 親 HTML -----
<html xmlns:wicket="">http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<body>
<form wicket:id="myform">
<p>
<div wicket:id="tabs" class="tabpanel"></div>
</p>
<button wicket:id="gosubmit" type="submit">送信</button>
</form>
</body>
</html>
----- 親 WebPage -----
public class TabbedPanelPage extends WebPage{
Foo foo; // Foo というform入力を蓄積する Serializable オブジェクト
// Foo では、String inputField1 , inputField2 , inputField3
// の setter と getter を書く
public TabbedPanelPage(){
final Form<Void> form = new Form<Void>("myform"
,new CompoundPropertyModel<Void>(this.foo));
// タブのリストを用意
List<ITab> tabs = new ArrayList<ITab>();
tabs.add(new AbstractTab(new Model<String>("No.1")){
@Override
public Panel getPanel(String panelId){
Panel p = new TabPanel1(panelId,form.getModel());
TextField field = new TextField("inputField1");
form.add(field);
p.add(field);
return p;
}
}
);
// 2番目、3番目も上と同様に、
// tabs.add(new AbstractTab ... を書く
// タブ リストを Form コンポーネントに追加
form.add(new AjaxTabbedPanel("tabs",tabs));
// submit ボタンセット
Button gobutton = new Button("gosubmit"){
@Override
public void onSubmit(){
// TabbedPanelPage.this.foo で入力値を取得
};
};
form.add(gobutton);
add(form);
}
// 各タブのクラス
private static class TabPanel1 extends Panel{
public TabPanel1(String id,IModel model){
super(id,model);
}
}
// 2番目、3番目も上と同様に、Panelクラスを用意
}
---------------------------------------------------------
org.apache.wicket.model.CompoundPropertyModel でform入力を蓄積する
setter と getter が用意されたインスタンスを指定するのが
ポイントです。
------ タブのHTML -------
<html xmlns:wicket="">http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<wicket:panel>
<br/>
This is tab-panel 1
<br/>
<input type="text" wicket:id="inputField1"/>
<br/>
</wicket:panel>
</html>