2011-05-18 13 views
1

私はウィジェットアプリケーションを開発しており、別の要素に基づいて幅を調整する必要のあるパネルを作成したいと考えています。wicketの別のコンポーネントに基づいてパネルの幅を調整する方法

マークアップは次のようになります。

<div wicket:id="lazyPanel" style="float: left;"></div> 
<div wicket:id="widthSpan" style="float: right; width: 30%;"></div> 

および関連するJavaコードは次のとおりです。

final WebMarkupContainer widthSpan = new WebMarkupContainer("widthSpan"); 
add(widthSpan); 
add(new AjaxLazyLoadPanel("lazyPanel") { 
    public Component getLazyLoadComponent(String markupId) { 
      // calculate the width based on widthSpan 
      int width = 1000 - widthOf(sidebar); 
      return new MyPanel(markupId, width); 
    } 
}); 

は、私は、サイドバーの幅を取得するには、いくつかのJavaScriptを使用することができます知っているが、どのように私はそれを送ることができます改札に戻る?

答えて

1

私は解決策を見つけました。ここで

widthSpan.add(new AbstractDefaultAjaxBehavior() { 
    @Override 
    protected CharSequence getCallbackScript() { 
     return generateCallbackScript("wicketAjaxGet('" + getCallbackUrl() + 
         "&ExpectedWidth=' + expectedWidth"); 
    } 

    @Override 
    public void renderHead(Component component, IHeaderResponse response) { 
     super.renderHead(component, response); 
     StringBuffer sb = new StringBuffer(); 
     sb.append("var expectedWidth = $('#") 
      .append(getComponent().getMarkupId()) 
      .append("').width();"); 
     sb.append(getCallbackScript()); 
     response.renderOnDomReadyScript(sb.toString()); 
    } 

    @Override 
    protected void respond(AjaxRequestTarget target) { 
     int width = RequestCycle.get().getRequest().getQueryParameters() 
       .getParameterValue("ExpectedWidth").toInt(280); 
     Component lazy = createComponent("lazyPanel", 1000 - width); 
     target.add(lazy); 
    } 
}; 

は、我々はクエリパラメータExpectedWidthを追加する動作を使用してjqueryのスクリプトから取得される、および応答機能では、我々が作成し、実際のパネルを追加します。同様に、widthSpanにAjaxBehaviorを追加します。

関連する問題