0

パネル内に、垂直スクロールが有効になっていて、cssを使用した絶対位置が設定されているListViewがあります。listViewに追加されたIndicatingAjaxFallbackLinkを選択すると、ページ上の他のパネルが更新され、listItemの詳細情報/オプションが提供されます。また、listViewを更新して、選択したlistItemを強調表示するcssクラスを追加します。選択したlistItemを表示するためにスクロールしてレンダリングされるように、listViewにアンカーを追加しようとしています。

問題：リストの下の項目を選択すると、listViewは、選択した項目ではなく、パネルの上部にスクロールしてリロードします。これは、URLリダイレクトと全ページのリロードなしで可能ですか？

マークアップ：

<div wicket:id="psbContainer" style="position: absolute; top: 325px; height: 300px; overflow-y: auto; left: 4px; right: 305px;">
    <table width="100%">
        <tr wicket:id="psbList" valign="top">
            <td><a wicket:id="viewRelated"><span wicket:id="psbNum"/></a></td>
            <td wicket:id="summary"/>
            <td wicket:id="psbMilestone"/>
            <td wicket:id="dueDate"/>
            <td wicket:id="devCount"/>
            <td wicket:id="activeCount"/>
            <td wicket:id="ccCount"/>
            <td wicket:id="team"/>
        </tr>
    </table>
</div>

java：

    psbListView = new ListView("psbList", psbList) {
        protected void populateItem(ListItem listItem) {
            final Space psb = (Space) listItem.getModelObject();
            if(psb.equals(psbSelected)) {
                listItem.add(selected);
            }
            // viewRelated ========================================================
            IndicatingAjaxFallbackLink viewRelated = new IndicatingAjaxFallbackLink("viewRelated") {
                public void onClick(AjaxRequestTarget target) {
                    psbSelected = psb;
                    target.addComponent(pslpContainer);
                }
            };
            this.setOutputMarkupId(true);
            this.setMarkupId(psb.getPsbNum());
            viewRelated.setAnchor(this);
            viewRelated.add(new Label("psbNum", new Model(psb.getPsbNum())));
            listItem.add(viewRelated);
            ...
4

1 に答える 1

1

AjaxRequestTarget で純粋な JavaScript を使用して、クライアント側の CSS スタイルを更新しないのはなぜですか? おそらくそれ以上ではない

ListItem<?> previousSelected = ...;
ListItem<?> currentSelected = ...;

target.appendJavaScript("document.getElementById('" + previousSelected.getMarkupId() + "').className=\"\";");
target.appendJavaScript("document.getElementById('" + currentSelected.getMarkupId() + "').className=\"selected\";");

この方法では、一部のクラスを変更するだけでリストビュー全体を更新する必要はありません。

于 2012-11-13T09:59:40.940 に答える