2

最近 XPages を使用していますが、コンテナー コントロール内のデータの並べ替えに問題があります。複数のソリューション、ビュー パネル、データ テーブル、および繰り返しコントロールを使用してデータを適切に表示することができましたが、並べ替えはビュー パネルを介してのみうまく機能するようです。(いくつかの調査を行い、 Java.Util.TreeMap が他のコンテナーにいくつかのユーティリティを提供することを認識した後)。ただし、私が抱えている問題は、並べ替えのために追加された列ヘッダーを表示する画像が、私が望むものではないことです。

そこで、私の質問は次のとおりです。XPages がこれらの画像を検索する場所を変更する方法はありますか (Image.ViewColumnHeaderSort を介してその画像タグにクラスを設定できることを知っていても、イベントにアクセスできないため役に立ちません)。 TH 要素のクラスを計算するために使用できるスコープ変数を設定するために、イベントにアクセスします。

前もって感謝します, アーロンブレーキ 4CTechnologies

4

1 に答える 1

1

この問題の回避策は次のとおりです。ビュー パネルの列の並べ替えに URL パラメーターを使用します。

XPage の例:

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
    <xp:this.resources>
        <xp:script src="/jssViewSort.jss" clientSide="false"></xp:script>
    </xp:this.resources>

    <xp:viewPanel rows="30" id="viewPanel2">
        <xp:this.facets>
            <xp:pager partialRefresh="true" layout="Previous Group Next"
                xp:key="headerPager" id="pager2">
            </xp:pager>
        </xp:this.facets>
        <xp:this.data>
            <xp:dominoView var="view1" viewName="_YOUR_VIEW_"></xp:dominoView>
        </xp:this.data>
        <xp:viewColumn columnName="Form" id="viewColumn3">
            <xp:viewColumnHeader value="Form" id="viewColumnHeader3" iconSrc="#{javascript:getViewSortIcon(this)}">
            <xp:this.attrs>
                    <xp:attr name="onclick">
                        <xp:this.value><![CDATA[#{javascript:getViewSortLink(this)}]]></xp:this.value>
                    </xp:attr>
                </xp:this.attrs>
            </xp:viewColumnHeader>
        </xp:viewColumn>
    </xp:viewPanel>

</xp:view>

使用されるビューには、「フォーム」という名前の並べ替え可能な列があり、両方向に並べ替えることができます。

そして、最適化も文書化もされていない SSJS ライブラリは次のとおりです。

/**
 * returns a link for sorting a view panel
 * 
 * @author Sven Hasselbach
 * @version 0.1
 */
function getViewSortLink( colHeader:com.ibm.xsp.component.xp.XspViewColumnHeader ){

    var col:com.ibm.xsp.component.xp.XspViewColumn = colHeader.getParent();
    var vp:com.ibm.xsp.component.xp.XspViewPanel = col.getParent();
    var ds:com.ibm.xsp.model.domino.DominoViewData = vp.getDataSource();
    var curSortOrder = vp.getDataSource().getSortOrder();

    var sortCol = context.getUrlParameter("sortColumn");
    var sortOrder = context.getUrlParameter("sortOrder");

    if( sortCol === col.getColumnName() ){
        if( curSortOrder === null || curSortOrder === "" )
            sortOrder = "ascending";

        if( curSortOrder === "ascending" )
            sortOrder = "descending";

        if( curSortOrder === "descending" )
            sortOrder = ""

    }else{
        sortOrder = "ascending";
        sortCol = col.getColumnName();
    }

    return "window.location='" + context.getUrl().getPath() + "?sortColumn=" + sortCol + "&sortOrder=" + sortOrder + "'";
}

/**
 * returns a view icon for sorting
 * 
 * @author Sven Hasselbach
 * @version 0.1
 */
function getViewSortIcon( colHeader:com.ibm.xsp.component.xp.XspViewColumnHeader ){

    var col:com.ibm.xsp.component.xp.XspViewColumn = colHeader.getParent();
    var vp:com.ibm.xsp.component.xp.XspViewPanel = col.getParent();
    var ds:com.ibm.xsp.model.domino.DominoViewData = vp.getDataSource();
    var curSortOrder = vp.getDataSource().getSortOrder();

    var sortCol = context.getUrlParameter("sortColumn");

    if( sortCol !== col.getColumnName() )
        return "http://www.google.de/images/icons/product/chrome-48.png";

    if( curSortOrder === "ascending" )
        return "https://www.google.com/intl/de/images/icons/feature/alert-b42.png"

    if( curSortOrder === "descending" )
        return "https://www.google.com/intl/de/images/icons/product/calendar-42.png"    

    return "http://www.google.de/images/icons/product/chrome-48.png";

}

画像はCSSで調整できます。

お役に立てれば！

于 2012-11-30T11:46:47.787 に答える