Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3
Panel
borderStylesolid
titleTable of contents
Table of Contents
minLevel2

Scope

ComponentBackground | componentJavadoc=Panel

Background

A Panel is a reusable component that holds markup and other components. If you want to reuse a component without copying its markup into each page markup, extend the class Panel:

You can use Markup inheritance with Panels too.

See Panels and borders to see the difference between Panels and Borders and Fragment to see how to use 'in-line' panels.

Panels can be used to create dynamic markup hierarchies.

FAQ

Examples

Typical usage

UserPanel.java:

Code Block
    public class UserPanel extends Panel {
      public UserPanel(String id, User user) {
        super(id);
        add(new Label("username", user.getUsername()));
        add(new Label("lastLogin", user.getLastLogin()));
      }
    }

UserPanel.html:

Code Block
html
html
    <wicket:panel>
      User:        <span wicket:id="username">dummy name</span><br/>
      Last log-in: <span wicket:id="lastLogin">2037-09-10 10:21:59h</span>
    </wicket:panel>

That's for your reusable panel, which you can now use anywhere like:

Code Block
    add(new UserPanel("user", user);

and:

Code Block
html
html
    <span wicket:id="user">[user data]</span>

or for better previewability:

Code Block
html
html
    <span wicket:id="user">
      <wicket:remove>
        User:        dummy name<br/>
        Last log-in: 2037-09-10 10:21:59h
      <wicket:remove>
    </span>

Advanced example using a ListView

UsersListPanel.java:

Code Block
    public class UsersListPanel extends Panel {
      public UsersListPanel(String id, List users) {
        super(id);
        add(new ListView("users", users) {
           public void populateItem(final ListItem p_item) {
             final User user = (User) p_item.getModelObject();
             p_item.add(new Label("username", user.getUsername()));
             p_item.add(new Label("lastLogin", user.getLastLogin()));
        }});
      }
    }

UsersListPanel.html:

Code Block
html
html
    <wicket:panel>
      <table>
        <tr>
          <th>user name</th>
          <th>last login</th>
        </tr>

        <tr wicket:id="users">
          <td><span wicket:id="username"></span></td>
          <td><span wicket:id="lastLogin"></span></td>
        </tr>
      </table>
    </wicket:panel>

That's for your reusable panel, which you can now use anywhere like:

Code Block
    add(new UsersListPanel("users", users));

and:

Code Block
html
html
    <span wicket:id="users">[users here]</span>

or for better previewability:

Code Block
html
html
    <span wicket:id="users">
      <wicket:remove>
      <table>
        <tr>
          <th>user name</th>
          <th>last login</th>
        </tr>

        <tr>
          <td>dummy Username</td>
          <td>2037-09-10 10:21:59h</td>
        </tr>
      </table>
      <wicket:remove>
    </span>