Primefaces p:dataTable不'；t显示每个p:selectMany复选框选中

传递了以下示例：

我可以将完整的示例显示为primefaces测试主机，并作为mvn clean jetty运行：run exploded

我使用“p:selectManyCheckbox”创建了一个显示屏，以显示我所有的年份、品牌、颜色、价格和销售额，如下所示：

<p:selectManyCheckbox id="carColumns" value="#{carService.selectedItems}">
            <f:selectItem itemLabel="Year" itemValue="Year"/>
            <f:selectItem itemLabel="Brand" itemValue="Brand"/>
            <f:selectItem itemLabel="Colour" itemValue="Colour"/>
            <f:selectItem itemLabel="Price" itemValue="Price"/>
            <f:selectItem itemLabel="Sold" itemValue="Sold"/>
            <p:ajax listener="#{carService.selectedItemsChanged}" update="formCars:tblCars"/>
 </p:selectManyCheckbox>

然后显示p:dataTable和“car”的每个p:column以及其他：

<p:dataTable id="tblCars" var="car" value="#{dtBasicView.cars}" paginator="true"
                     rows="100"
                     multiViewState="true"
                     paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                     rowsPerPageTemplate="5,10,15,20,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100"
                     resizableColumns="true"
                     draggableColumns="true"
                     scrollWidth="100%">

            <f:facet name="header">
                <p:commandButton id="columnTogglerCars" type="button" value="Columns" style="float:right"
                                 icon="pi pi-align-justify"/>
                <p:columnToggler datasource="tblCars" trigger="columnTogglerCars"/>
            </f:facet>

            <p:column headerText="Id" rendered="true">
                <h:outputText value="#{car.id}"/>
            </p:column>

            <p:column headerText="Year" sortBy="#{car.year}" rendered="#{carService.yearColumnRendered}">
                <h:outputText value="#{car.year}"/>
            </p:column>

            <p:column headerText="Brand" sortBy="#{car.brand}" rendered="#{carService.brandColumnRendered}">
                <h:outputText value="#{car.brand}"/>
            </p:column>

            <p:column headerText="Colour" sortBy="#{car.colour}" rendered="#{carService.colourColumnRendered}">
                <h:outputText value="#{car.colour}"/>
            </p:column>

            <p:column headerText="Price" sortBy="#{car.price}" rendered="#{carService.priceColumnRendered}">
                <h:outputText value="#{car.price}"/>
            </p:column>

            <p:column headerText="Sold" sortBy="#{car.sold}" rendered="#{carService.soldColumnRendered}">
                <h:outputText value="#{car.sold}"/>
            </p:column>
</p:dataTable>

如果我随后更改p:selectManyCheckbox所选项目上显示的p:column Header文本的订单（向上或向下），则有时不会在数据表中实际显示“年份、品牌、颜色、价格和销售额”

p:selectManyCheckbox和p:dataTable是否有问题

（1） 五张图片“年份、品牌、颜色、价格和销售情况”如何。 （2） 显示两页“年份，品牌” （3） 选择“年份、品牌、颜色”，但仅显示“年份、品牌”，尽管选择了（颜色）

---

查看以下代码：

我在ajax和p:dataTable中遇到了相同的问题，我解决了这个问题，将p:dataTable插入到p:panel中，使用ajax我更新了panel，例如

<p:panel id="panel-update">
    <p:dataTable id="tblCars" var="car" value="#{dtBasicView.cars}" paginator="true"
                         rows="100"
                         multiViewState="true"
                         paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                         rowsPerPageTemplate="5,10,15,20,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100"
                         resizableColumns="true"
                         draggableColumns="true"
                         scrollWidth="100%">

                <f:facet name="header">
                    <p:commandButton id="columnTogglerCars" type="button" value="Columns" style="float:right"
                                     icon="pi pi-align-justify"/>
                    <p:columnToggler datasource="tblCars" trigger="columnTogglerCars"/>
                </f:facet>

                <p:column headerText="Id" rendered="true">
                    <h:outputText value="#{car.id}"/>
                </p:column>

                <p:column headerText="Year" sortBy="#{car.year}" rendered="#{carService.yearColumnRendered}">
                    <h:outputText value="#{car.year}"/>
                </p:column>

                <p:column headerText="Brand" sortBy="#{car.brand}" rendered="#{carService.brandColumnRendered}">
                    <h:outputText value="#{car.brand}"/>
                </p:column>

                <p:column headerText="Colour" sortBy="#{car.colour}" rendered="#{carService.colourColumnRendered}">
                    <h:outputText value="#{car.colour}"/>
                </p:column>

                <p:column headerText="Price" sortBy="#{car.price}" rendered="#{carService.priceColumnRendered}">
                    <h:outputText value="#{car.price}"/>
                </p:column>

                <p:column headerText="Sold" sortBy="#{car.sold}" rendered="#{carService.soldColumnRendered}">
                    <h:outputText value="#{car.sold}"/>
                </p:column>
    </p:dataTable>
</p:panel>

现在使用ajax可以更新面板

<p:selectManyCheckbox id="carColumns" value="#{carService.selectedItems}">
            <f:selectItem itemLabel="Year" itemValue="Year"/>
            <f:selectItem itemLabel="Brand" itemValue="Brand"/>
            <f:selectItem itemLabel="Colour" itemValue="Colour"/>
            <f:selectItem itemLabel="Price" itemValue="Price"/>
            <f:selectItem itemLabel="Sold" itemValue="Sold"/>
            <p:ajax listener="#{carService.selectedItemsChanged}" update="formCars:panel-update"/>
 </p:selectManyCheckbox>

---

我在ajax和p:dataTable中遇到了同样的问题，我解决了这个问题，将p:dataTable插入到p:panel中，并使用ajax更新了panel，例如

<p:panel id="panel-update">
    <p:dataTable id="tblCars" var="car" value="#{dtBasicView.cars}" paginator="true"
                         rows="100"
                         multiViewState="true"
                         paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
                         rowsPerPageTemplate="5,10,15,20,25,30,35,40,45,50,55,60,65,70,75,80,85,90,95,100"
                         resizableColumns="true"
                         draggableColumns="true"
                         scrollWidth="100%">

                <f:facet name="header">
                    <p:commandButton id="columnTogglerCars" type="button" value="Columns" style="float:right"
                                     icon="pi pi-align-justify"/>
                    <p:columnToggler datasource="tblCars" trigger="columnTogglerCars"/>
                </f:facet>

                <p:column headerText="Id" rendered="true">
                    <h:outputText value="#{car.id}"/>
                </p:column>

                <p:column headerText="Year" sortBy="#{car.year}" rendered="#{carService.yearColumnRendered}">
                    <h:outputText value="#{car.year}"/>
                </p:column>

                <p:column headerText="Brand" sortBy="#{car.brand}" rendered="#{carService.brandColumnRendered}">
                    <h:outputText value="#{car.brand}"/>
                </p:column>

                <p:column headerText="Colour" sortBy="#{car.colour}" rendered="#{carService.colourColumnRendered}">
                    <h:outputText value="#{car.colour}"/>
                </p:column>

                <p:column headerText="Price" sortBy="#{car.price}" rendered="#{carService.priceColumnRendered}">
                    <h:outputText value="#{car.price}"/>
                </p:column>

                <p:column headerText="Sold" sortBy="#{car.sold}" rendered="#{carService.soldColumnRendered}">
                    <h:outputText value="#{car.sold}"/>
                </p:column>
    </p:dataTable>
</p:panel>

现在使用ajax可以更新面板

<p:selectManyCheckbox id="carColumns" value="#{carService.selectedItems}">
            <f:selectItem itemLabel="Year" itemValue="Year"/>
            <f:selectItem itemLabel="Brand" itemValue="Brand"/>
            <f:selectItem itemLabel="Colour" itemValue="Colour"/>
            <f:selectItem itemLabel="Price" itemValue="Price"/>
            <f:selectItem itemLabel="Sold" itemValue="Sold"/>
            <p:ajax listener="#{carService.selectedItemsChanged}" update="formCars:panel-update"/>
 </p:selectManyCheckbox>

---

如果您正在做一些不一致的事情，

p:columnToggler

使用javascript来显示和隐藏这些数据表列，但是使用selectManyCheckbox您使用jsf some managed bean来不呈现某些列，首先要坚持其中之一，作为selectManyCheckbox及其托管bean

carService。selectedItems

不知道使用

p:columnToggler

隐藏或显示了什么

无论如何，如果您试图创建一个具有动态列的

p:dataTable

，那么您应该像下面这样做

编辑1：

---

如Kukeltje comment中所述，如果您确实需要管理在后台bean中显示和隐藏列，并且仍然能够使用ColumntToggler，那么使用p:column的visible属性而不是使用rendered是一种可行的方法，

p:columnToggler

使用javascript来显示和隐藏那些dataTable列，但使用selectManyCheckbox时，您使用的是jsf some managed bean来不呈现某些列，首先要坚持其中一个，作为selectManyCheckbox及其托管bean

carService。selectedItems

不知道使用

p:columnToggler

隐藏或显示了什么

无论如何，如果您试图创建一个具有动态列的

p:dataTable

，那么您应该像下面这样做

编辑1：

---

如Kukeltje comment中所述，如果您确实需要管理在后台bean中显示和隐藏列，并且仍然能够使用ColumntToggler，尝试在面板中插入TBLCAR，并使用ajax更新面板，那么使用p:column的visible属性而不是使用rendered是一种可行的方法，我也有同样的问题，这已经解决了，谢谢。你有一个拉动示例吗？是的，我添加了一个新的答案尝试在面板中插入TBLCAR，使用ajax更新面板，我有同样的问题，这已经解决了这个问题。你有一个拉动示例吗？是的，我添加了一个新的答案。奇怪的是，更新数据表周围的面板使其工作。你在做什么版本？@Kukeltje Yes很奇怪，我对jsf版本2.2和2.3以及6.9和7.9的primefesis1有这个问题：它的PrimeFaces，2:6.9和7.9没有exist@Kukeltje是的，这很奇怪，我在2.2和2.3版jsf以及6.0和7.0版primefesis中遇到了这个问题，对不起，我的错误。你的例子和我原来做的完全一样。一旦我上下更改了“sortBy”的顺序并选择了“p:selectManyCheckbox”，它现在就不会出现在带有“p:column”的“p:dataTable”上。奇怪的是，更新dataTable周围的面板会使它工作。你在做什么版本？@Kukeltje Yes很奇怪，我对jsf版本2.2和2.3以及6.9和7.9的primefesis1有这个问题：它的PrimeFaces，2:6.9和7.9没有exist@Kukeltje是的，这很奇怪，我在2.2和2.3版jsf以及6.0和7.0版primefesis中遇到了这个问题，对不起，我的错误。你的例子和我原来做的完全一样。一旦我上下更改了“sortBy”的顺序，并且选择了“p:selectManyCheckbox”，现在就可以了