2

現在の Wicket アプリケーションでは、ユーザーが 1 つのメニュー項目をクリックすると、ページ全体をリロードします。必要なパネルのみをリロードするようにこれを変更したいと思います。

私が現在していること：

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

私のHomePage.html：

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

my HomePage.java(および他のすべてのページ) に Panel を追加します。

add(new HomePanel("homePanel"));

ページ全体を再レンダリングせずsetResponsePage()にパネルを開きたいのではなく。<div class="panelarea">

誰でも私にヒントを与えることができますか？

4

2 に答える 2

6

次の 2 つの可能性があります。

  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);
    }
});
于 2014-06-05T13:48:47.957 に答える
1

置き換えたい div の content Panel オブジェクトを作成します。

 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);
}

ajaxlink onSubmit 内でこれを呼び出して、古いパネルを置き換える正しいパネルを指定します。

于 2014-06-05T13:44:14.840 に答える