2

列を選択する方法を知りたい

私は次のデータテーブルを持っています

<p:dataTable id="DataTable" value="#{dataTable.selecDataModel}" var="test" scrollable="TRUE" scrollHeight="500" styleClass="day-column2" selectionMode="single" >
    <p:column headerText="Column1" footerText="Column1" width="450">
        <h:outputText value="Test1" />
    </p:column>
    <p:column headerText="Column2" footerText="Column2" width="450">
        <h:outputText value="Test2" />
    </p:column>
 </p:dataTable>

p:ajaxは行の選択のみをサポートしています。どの列が選択されているかを知りたい場合、どうすれば同じものを取得できますか。

4

1 に答える 1

2

選択した列のインデックスをjQueryで見つけて、ajaxイベントとしてサーバーに送信できます

ここに方法があります:

inputText最初にテーブルの上に追加します(非表示にします)

<h:inputText id="mySelectedColumnId" value="#{myBean.mySelectedColumnField}" style="display:none">
    <f:ajax listener="#{myBean.myListener}"></f:ajax>
</h:inputText>

そして、次のjsコードをバインドして、テーブルをクリックし、クリックをトリガーします。h:inputTextこれにより、サーバーでリッスンがトリガーされます。

jQuery(document).delegate("#yourTableID td", "click", function (event) {//bind every click on any td in the table
    var columnNumber = jQuery(this).index();//get index of clicked row
    jQuery("#mySelectedColumnId").val(columnNumber); //set value in the inputtext
    jQuery("#mySelectedColumnId").change(); //this will trigger the ajax listener
});

アップデート

私が実際に意味したのは、次の構造でした。

<h:outputScript name="js/newjavascriptfile.js" target="head" />

.
.
.
.

<h:form prependId="false">
     <h:inputText id="mySelectedColumnId" value="#{myBean.mySelectedColumnField}" style="display:none">
         <f:ajax listener="#{myBean.myListener}"></f:ajax>
     </h:inputText>
     <p:dataTable id="DataTable"....
.
.
.
.

およびjs内(Webアプリフォルダーのルートにあるresourcesフォルダー内のjsフォルダー内に配置します。Resources (Library)In JSF 2.0)ファイルの場所

jQuery(window).load(function () {
     jQuery(document).delegate("#yourTableID td", "click", function (event) {//bind every click on any td in the table
        var columnNumber = jQuery(this).index();//get index of clicked row
        jQuery("#mySelectedColumnId").val(columnNumber); //set value in the inputtext
        jQuery("#mySelectedColumnId").change(); //this will trigger the ajax listener
    });
});
于 2012-09-16T05:55:44.380 に答える