Динамическая загрузка панелей калитки в ‹div›

В моем текущем приложении Wicket я в настоящее время перезагружаю полную страницу после того, как пользователь нажимает на один пункт меню. Я хочу изменить это, чтобы перезагрузить только необходимую панель.

Чем я сейчас занимаюсь:

У меня есть BasePage.html, который содержит пункты меню и некоторый статический контент:

<li><a wicket:id="home" href="#">Home</a></li>
<li><a wicket:id="user" href="#">User</a></li>

<!-- and so on ->

<div class="panelarea">
    <wicket:child />
</div>

и мой (абстрактный) BasePage.java:

add(new AjaxSubmitLink("home") {
    protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
        setResponsePage(new HomePage());
    }
});
//etc

my HomePage.html:

<wicket:extend>
    <span wicket:id="homePanel"></span>
</wicket:extend>

моя HomePage.java (и все остальные страницы) затем добавляет панель:

add(new HomePanel("homePanel"));

Вместо setResponsePage() я хочу открыть панель в <div class="panelarea"> без перерисовки всей страницы.

Кто-нибудь может подсказать?


java wicket wicket-6
person Markus    schedule 05.06.2014    source источник
comment
Кажется, вы уже идете по пути Ajax, поэтому теперь вам нужно только завершить это, изменив модель страницы и указав Wicket, какие разделы нужно обновить. Контрпример — одна из самых простых демонстраций этого: wicket.apache.org/learn/ примеры/ajaxcounter.html   -  person Gimby    schedule 05.06.2014

Ответы (2)


arrow_upward
6
arrow_downward

У вас есть две возможности:

  1. Сделайте вашу панель скрытой и покажите ее после запроса ajax
  2. Поместите EmptyPanel и замените его после запроса ajax

В обоих случаях вы должны поместить тег-заполнитель в свою разметку, включая выходную разметку.

<span wicket:id="homePanel"></span>

РЕШЕНИЕ 1. Сделайте панель скрытой и покажите ее после запроса ajax

final Panel homePanel = new HomePanel("homePanel");
homePanel.setOuputMarkupPlaceholderTag(true);
homePanel.setOuputMarkupId(true);
homePanel.setVisible(false);
add(homePanel);
add(new AjaxSubmitLink("home") {
    protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
        homePanel.setVisible(true);
        // in Wicket 1.4 instead of target.add(Component)
        // target.addComponent(homePanel);
        target.add(homePanel);
    }
});

РЕШЕНИЕ 2. Разместите EmptyPanel и замените его после запроса ajax

final Panel emptyPanel = new EmptyPanel("homePanel");
emptyPanel.setOuputMarkupPlaceholderTag(true);
emptyPanel.setOuputMarkupId(true);
add(emptyPanel);
add(new AjaxSubmitLink("home") {
    protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
        Panel homePanel = new HomePanel("homePanel");
        homePanel.setOuputMarkupPlaceholderTag(true);
        homePanel.setOuputMarkupId(true);
        // if your Page class is MyPage.class
        MyPage.this.addOrReplace(homePanel);
        // in Wicket 1.4 instead of target.add(Component)
        // target.addComponent(homePanel);
        target.add(homePanel);
    }
});
person Martin Strejc    schedule 05.06.2014
comment
большое спасибо! многие вещи о калитке теперь стали немного яснее для меня - person Markus; 05.06.2014
comment
Вам не нужен setOuputMarkupPlaceholderTag, если панель остается видимой. - person RobAu; 11.06.2014
comment
Также вы должны использовать либо setOuputMarkupPlaceholderTag, либо setOuputMarkupId, но не оба, хотя это не приводит к ошибке. - person BlondCode; 10.01.2017

arrow_upward
1
arrow_downward

Создайте объект Content Panel для div, который вы хотите заменить:

 private Panel currentpanel = getHomePagePanel(); // fill it with any Panel you want.

Вы можете заменить панель «контент» следующим образом:

private void changePanel() {
    Panel newpanel = getNewPanel(); // Or pass as arg to this function
    newpanel.setOutputMarkupId(true);
    currentpanel.replaceWith(newpanel);
    currentpanel = newpanel;
    target.add(currentpanel);
}

Вызовите это в своей ajax-ссылке onSubmit с правильной панелью, чтобы заменить старую.

person Martin    schedule 05.06.2014