【问题标题】:Primefaces Datatable column selectionPrimefaces 数据表列选择
【发布时间】:2012-09-08 13:00:14
【问题描述】:

我想知道如何获得列选择

我有以下数据表

<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 只支持行选择,如果我想知道选择了哪一列,如何得到一样。

【问题讨论】:

    标签: jsf-2 primefaces


    【解决方案1】:

    您可以使用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 (Library) In JSF 2.0 根目录下的资源文件夹中的 js 文件夹中)文件位置

    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
        });
    });
    

    【讨论】:

    • 感谢回复,但是primeface数据表中没有onClick事件,在这种情况下我如何激活js代码(我正在学习js)。
    • 好的,我通过在 p:column 中放置一个 inputText 并使用它的 onClick 事件来做到这一点,感谢您的解决方案。
    • @user1433804 不客气,我用扩展解释更新了我的答案...
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-12-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-16
    相关资源
    最近更新 更多