学步园

    在一个项目，页面经常要显示和隐藏一些控件，用wicket来控制显示和隐藏控件相当的方便。

1、最简单的隐藏和显示方法:

wicket的控件大部分都有setVisible(...)方法，用这个方法就可以隐藏和显示大部分的控件。

如
Button addSpNumButton = new Button("addSpNum") {<br /> @Override<br /> public void onSubmit() {<br /> addEntSpNumPanel.setVisible(true);<br /> showSpNumUsePanel.setVisible(false);<br /> this.setVisible(false);//隐藏控件本身<br /> }<br /> };

2、通过ajax方式隐藏控件

这个可以说wicket一个做的不大好的地方。通过ajax方式隐藏控件要分两种情况分析。
 （1）隐藏单一控件：

如果只是要隐藏一个控件，就比较容易做，比如，通过下拉框的ajax方式隐藏一个下拉框控件:

actTypeChoice是一个下拉框控件，当控件的值改变时，触发onUpdate(..)事件。在这里也要注意，target.addComponent(dataGroupChoice)中的控件dataGroupChoice必须设置一个属性才能正常隐藏显示，否则会报异常。属性如下：

 dataGroupChoice.setOutputMarkupId(true); 

（2）隐藏一个以上的控件

如果你要隐藏一个以上的控件，比如要隐藏一个表格，那么就最好把这个表格放在一个WebMarkupContainer里面，这样隐藏的时候只要控制这个WebMarkupContainer控件就可以了。看例子：
<span wicket:id="addEntSpNumPar"><br /> <span wicket:id="addEntSpNum"><br /> <table cellspacing="0" cellpadding="0" width="100%"><br /> <tr><br /> <th align="right" style="width: 60px;">测试: </th><br /> <td style="width: 60%"><br /> <input type="text" wicket:id="spNum"/><br /> </td><br /> </tr><br /> <tr><br /> <th align="right" style="width: 60px;">测试2: </th><br /> <td style="width: 60%"><br /> <input type="text" wicket:id="spNum2"/><br /> </td><br /> </tr><br /> </table><br /> </span><br /> </span>

WebMarkupContainer addEntSpNumPanelPar = new WebMarkupContainer("addEntSpNumPar");<br /> WebMarkupContainer addEntSpNumPanel = new WebMarkupContainer("addEntSpNum");<br /> addEntSpNumPanel.setOutputMarkupId(true);<br /> addEntSpNumPanelPar.add(addEntSpNumPanel);<br /> TextField spNumText = new TextField("spNum", new Model());<br /> addEntSpNumPanel.add(spNumText);<br /> TextField spNumText2 = new TextField("spNum2", new Model());<br /> addEntSpNumPanel.add(spNumText2);

改变事件：

actTypeChoice.add(new AjaxFormComponentUpdatingBehavior("onchange") {<br /> @Override<br /> protected void onUpdate(AjaxRequestTarget target) {<br /> addEntSpNumPanel.setVisible(false);<br /> target.addComponent(addEntSpNumPanelPar);<br /> }

http://redirect.simba.taobao.com/rd?w=unionnojs&f=http%3A%2F%2Fre.taobao.com%2Feauction%3Fe%3DZS%252BOtIhkWPQjmraEDZVrLo2nkleaNRE21BHSvcRrnkWLltG5xFicOSZqewpHPyZzYt8Ss1ORFTG%252FnFVoO8KPQEZoefxpXQfjUTm3B0pW5%252F2B3ujUJI0OeA%253D%253D%26ptype%3D100010&k=e2e107a2b72ca1b1&c=un&b=alimm_0&p=mm_51420591_5192268_15748715