CODEWITHSUNDEEP
ajaxwicketpanel
seba.wagner
seba.wagner

Reputation: 3860

Apache Wicket and Single Page Application (SPA) - How to create Panels from Menu?

we are building a Wicket application using Single Page Design. We trying to find out the best method to create a basic structure. My idea is that each dynamically loaded HTML components extends "Panel" ( http://wicket.apache.org/apidocs/1.4/org/apache/wicket/markup/html/panel/Panel.html).

However how can I load such a Panel into a div or content area into my application? I don't want to use AjaxTabbedPanel, as I will need to load Panels for example by clicking on the menu but also as result of other click events somewhere in the application I will need to replace certain Panels.

So the question might be: How to load a Panel using Ajax in Wicket? For example from a Menu button, or for example from any button in the application.

Thanks! Sebastian

Upvotes: 0

Views: 1996

Answers (1)

magomi
magomi

Reputation: 6685

You can add a Panel to a div:

Markup:

<div wicket:id="panel" />

Java-Code:

final YourPanel panel = new YourPanel("panel");
add(panel);

To change the Panel that is attached to the page I would surround the panel by an markup container, change the Panel on an (ajax) event (remove the old one and attach a newly created one) and update the markup container.

Markup:

<div wicket:id="markupContainer">
    <div wicket:id="panel" />
</div>

Java-Code

// initially create the panel
final WebMarkupContainer wmc = new WebMarkupContainer("markupContainer");
wmc.setOutputMarkupId(true);
add(wmc);
Panel panel = new YourPanel("panel");
wmc.add(panel);

// ...

// updating the panel on an ajax event (here: button click)
final AjaxButton yourButton = new AjaxButton(...) {
    @Override  
    public void onSubmit(AjaxRequestTarget target) {
        wmc.remove(panel);
        panel = new AnotherPanel("panel");
        wmc.add(panel);
        target.add(wmc);
    }
}
// ...

Upvotes: 3

Related Questions