web-dev-qa-db-ja.com

選択したprimefacesデータテーブル行の行番号を取得するには

JSFページで（選択された行番号）の（合計行数）を表示する必要があるPrimefacesデータテーブルがあります.rowIndexVar属性を使用して列の1つに行番号を表示できますが、表示するアイデアがありません行選択の入力テキストで同じ番号が別々に。

選択された行番号を取得するために、JSFページまたはマネージドBeanで何をする必要がありますか？.

この点で私を助けてください。

以下は私のJSFページです

<p:dataTable id="workSpaceList" var="data"
            value="#{workSpaceBean.lpInfoList}" widgetVar="multiSelection"
            selection="#{workSpaceBean.selectedRows}" resizableColumns="true"
            liveScroll="true" scrollRows="55" scrollWidth="85%"
            scrollHeight="81%" styleClass="datatable" 
            scrollable="true" rowIndexVar="rowIndex"
            filteredValue="#{workSpaceBean.filteredWorkSpaceItems}">

            <p:column selectionMode="multiple" style="width:3%" />
            <p:column headerText="#" style="width:3%">
                #{rowIndex+1}
            </p:column>
            <p:column headerText="Insured" filterBy="#{data.insuredName}"
                sortBy="#{data.insuredName}" style="width:24%">
                <h:outputText value="#{data.insuredName}" />
                <!--   style="width:250px" -->
            </p:column>

            <p:column headerText="City" filterBy="#{data.custAddress_City}"
                sortBy="#{data.custAddress_City}" style="width:12%">
                <h:outputText value="#{data.custAddress_City}" />
            </p:column>
            .
            .
            .
            .

        </p:dataTable>
jsf-2primefacesdatatable
8
rks

そうするための簡単な方法はないと思います。 2つのajax要求を使用するのはきれいではありませんが、少なくとも、プレーンなPrimeFacesを使用するときに期待する結果を得ることができます。 p:ajaxをPrimeFaces拡張機能 pe:javascript に置き換えてサーバーへのラウンドトリップを行わない場合、これを1つの呼び出しに減らすことができます。

データテーブルによってレンダリングされたすべての行（tr）には、rowKeyを持つdata-rkという属性とという別の属性がありますdata-riとrowIndexVar値。

data-rk属性はdtWidgetVar.selection（dtWidgetVarデータテーブル内のwidgetVarの名前です）。

これで、remoteCommandを使用してindexRowをモデルに送信できます。

テストに使用したコードは次のとおりです。

ビュー

<p:remoteCommand name="displayIndex" process="@this" update="index" actionListener="#{viewMBean.displayRowIndex}"/>

<p:dataTable id="dt" var="data"
             value="#{viewMBean.dataModel}" 
             selection="#{viewMBean.selectedRow}"
             selectionMode="single"
             widgetVar="dtVar"
             rowIndexVar="index">
    <p:ajax event="rowSelect" 
            oncomplete="displayIndex([{name:'index', value:jQuery('tr[data-rk=' + dtVar.selection + ']').attr('data-ri')}])" process="@this" />
    <p:column headerText="#">
        #{index + 1}
    </p:column>
    <p:column headerText="Dados">
        #{data.name}
    </p:column>
</p:dataTable>
<br />
Row Index: <p:inputText id="index" value="#{viewMBean.index}" />

マネージドBean

public void displayRowIndex() {
    FacesContext context = FacesContext.getCurrentInstance();
    Map map = context.getExternalContext().getRequestParameterMap();
    String pIndex = (String) map.get("index");
    index = Integer.parseInt(pIndex);
}

チェックボックス選択を使用している場合は、次のように選択したインデックスを取得できます。

function beforeDisplayingIndexes(){
    var indexes = "";
    jQuery("tbody .ui-chkbox-box").each(function(){
      if (jQuery(this).hasClass("ui-state-active")){
        indexes = indexes + (indexes === "" ? "" : ",") + jQuery(this).closest("tr").attr("data-ri");
      }
    });
    //for debuging only
    console.log(indexes);
    displayIndex([{name:'index', value:indexes}])
}

これで、コードを適切に変更して、それを利用できるようになります。

19
Daniel Camargo

他の答えの複雑な解決策に驚いています。あなたはあなたが#{workSpaceBean.lpInfoList}サーバーサイドで「選択」を実行すると、簡単に実行できます（PrimeFacesショーケースに従ってコード化し、ニーズに応じて調整します）

<p:ajax event="rowSelect" listener="#{dtSelectionView.onRowSelect}" update="..." />

public void onRowSelect(SelectEvent event) {
    int rownum = cars.indexOf((Car)event.getObject());

}
2
Kukeltje