Question

我尝试在一个p:datatable中使用 DataTables.js （特别是 FixedColumns ）。这是我的头脑：

<h:head>
    <title><ui:insert name="titulo">#{bundleComunes.Titulo}</ui:insert></title>
    <script type="text/javascript" charset="utf-8" src="#{request.contextPath}/extras/FixedColumns/media/js/FixedColumns.js" />
    <script type="text/javascript" charset="utf-8" src="#{request.contextPath}/js/media/js/jquery.js"/>
    <script type="text/javascript" charset="utf-8" src="#{request.contextPath}/js/media/js/jquery.dataTables.js"/>
</h:head>

这是我的p:dataTable

<p:dataTable var="row" id="list" value="#{BB.dataTable}" rowStyleClass="#{styleController.colored(row.modificable)}" style="width : 1024px">
        <p:column headerText="#{bundle['id1']}">
            <h:outputText value="#{row.id1}" title="#{row.id1.descripcion}" />
        </p:column>
        <p:column headerText="#{bundle['id2']}">
            <h:outputText value="#{row.id2}" title="#{row.id2.descripcion}" />
        </p:column>
        <p:columns var="fecha" value="#{BB.lFechaEntradaVigor}">
            <f:facet name="header">
                <h:outputText value="#{fecha}" />
            </f:facet>
            <h:outputText value="#{row.getCoste(fecha)}" styleClass="#{row.modificable &amp;&amp; row.isValido(fecha)?'vigor':''}" style="text-align:right;">
                    <f:convertNumber groupingUsed="true" minFractionDigits="2" />
            </h:outputText>
        </p:columns>
    </p:dataTable>

这是我的 js

var oTable2 = $('#list').find('table').dataTable({
            "sScrollX" : "100%", //Scroll
            "sScrollY" : "180",
            "bAutoWidth" : false,
            "bScrollCollapse" : true,
            "bPaginate" : false,
            "bSort" : false,
            "sInfo" : "",
            "sInfoEmpty" : ""
        });

var oFC = new FixedColumns（oTable2，{ “iLeftColumns”：4，//首先冻结列 “sHeightMatch”：“auto”， “iLeftWidth”：405 }）;

我发现这个question 但是 js 给了我这个错误：Can not get value ' aoColumns ' property : the object is null or undefined但错误在 FixedColumns.js：83 {{1} } "iTableColumns": oDT.fnSettings().aoColumns.length,为空

任何想法？ THX

Answer 1

尝试添加：

"aoColumns": [
      null
    ]

Answer 2

好的，我的问题 prependId 必须 false 。

<h:form id="idForm" prependId="false">

将DataTables.js应用于p：dataTable primefaces

2 个答案: