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;">测试:&nbsp;</th>
            <td style="width: 60%">
              <input type="text" wicket:id="spNum"/>
            </td>
          </tr>
          <tr>
            <th align="right" style="width: 60px;">测试2:&nbsp;</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);
            }

        });

 

posted @ 2016-03-17 21:23  山河永慕~  阅读(1557)  评论(0编辑  收藏  举报