Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Initial page for borders

...

ComponentBackground | componentJavadoc=PanelBorder

Background

A Border is a reusable component that holds markup and other components. Is special type of Panel with the ability to wrap code with a header and a footer specified by the Border component.

...

Code Block
html
html
    <wicket:border>

      <h1>Header</h1>
User:       User <span wicket:id="username">dummy name</span><br/>
      Last span> (last log-in: <span wicket:id="lastLogin">2037-09-10 10:21:59h</span>)

      <wicket:body/>

      Footer with copy right notice, disclaimer Lastetc.

    </wicket:border>

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

Code Block
    add(new UserPanelBaseBorder ("usermyBorder", user);

and:

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

or for better previewability:

Code Block
htmlhtml

    <span wicket:id="user"><h2>Welcome</h2>
    This is <wicket:remove>
just a place holder for page content ...
 User:   </span>

this will generate the following HTML output:

Code Block
html
html

     dummy name<br/><h1>Header</h1>
    User dummy name  Last(last log-in: 2037-09-10 10:21:59h
      <wicket:remove>)

    </span>

Advanced example using a ListView

UsersListPanel.java:

Code Block
<h2>Welcome</h2>
    publicThis classis UsersListPaneljust extendsa Panelplace {
holder for page    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()));content ...

    Footer with copy right notice,     p_item.add(new Label("lastLogin", user.getLastLogin()));
        }});
      }
    }

UsersListPanel.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:

...


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

or for better previewability:

...

disclaimer etc.

In other words, the body of the myBorder component is substituted into the border's associated markup at the position indicated by the <wicket:body> tag.

Regarding <wicket:body/> you have two options. Either use <wicket:body/> (open-close tag) which will automatically be expanded to <wicket:body>body content</wicket:body> or use <wicket:body>preview region</wicket:body> in your border's markup. The preview region (everything in between the open and close tag) will automatically be removed.

...