wicket基础应用(3)——wicket控件的隐藏和显示

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

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

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

如

addEntSpNumPanel.setVisible(true);//显示
showSpNumUsePanel.setVisible(false);//隐藏

如果要点击某个控件的同时隐藏这个控件本身，可以这样做：

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

2、通过ajax方式隐藏控件

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

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

		actTypeChoice.add(new AjaxFormComponentUpdatingBehavior("onchange") {

			@Override
			protected void onUpdate(AjaxRequestTarget target) {
				dataGroupChoice.setVisible(true);
				target.addComponent(dataGroupChoice);
			}

		});

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

dataGroupChoice.setOutputMarkupId(true);

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

如果你要隐藏一个以上的控件，比如要隐藏一个表格，那么就最好把这个表格放在一个WebMarkupContainer里面，这样隐藏的时候只要控制这个WebMarkupContainer控件就可以了。看例子：

<span wicket:id="addEntSpNumPar">
<span wicket:id="addEntSpNum">
        <table cellspacing="0" cellpadding="0" width="100%">
          <tr>
            <th align="right" style="width: 60px;">测试: </th>
            <td style="width: 60%">
              <input type="text" wicket:id="spNum"/>
            </td>
          </tr>
          <tr>
            <th align="right" style="width: 60px;">测试2: </th>
            <td style="width: 60%">
              <input type="text" wicket:id="spNum2"/>
            </td>
          </tr>
        </table>
</span>
</span>

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

改变事件：

		actTypeChoice.add(new AjaxFormComponentUpdatingBehavior("onchange") {

			@Override
			protected void onUpdate(AjaxRequestTarget target) {
				addEntSpNumPanel.setVisible(false);
				target.addComponent(addEntSpNumPanelPar);
			}

		});