提问者:小点点

p: dataTable不显示每个选定的p:selectManyCheckbox


通过了以下演示示例:

https://www . prime faces . org/showcase/ui/data/datatable/basic . XHTML

我可以将完整的示例显示为primeface测试主机,并作为mvn clean jetty运行:运行分解

我使用“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:列以及其他:

<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 headerText显示的订单(向上或向下),有时实际上不会显示“年份、品牌、颜色、价格

p:selectManyCheckbox和p:dataTable我做错了吗?

(1)如何所有五个图像“年份,品牌,颜色,价格

代码见:https://www . Dropbox . com/s/vfugj 0 fppejtti 7/prime faces-test-master . zip?dl=0


共2个答案

匿名用户

我在ajax和p: dataTable上遇到了同样的问题,我解决了它,在p:面板中插入p:dataTable,并且使用ajax我更新了面板,一个例子

<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 来显示和隐藏那些 dataTable 列,但是使用 selectManyCheckbox,你正在使用 jsf 一些托管 bean 来不渲染一些列,首先坚持其中一个,作为 selectManyCheckbox 和它管理的 bean carService.selectedItems 不知道你使用 p 隐藏或显示了什么:列切换器

无论如何,如果您尝试创建一个具有动态列的p: dataTable,那么您应该按照此示例中的方式进行操作。

编辑 1:如 Kukeltje 注释中所述,如果您真的想要管理在支持豆中的显示和隐藏列并且仍然能够使用 columnToggler