PrimeFaces恢复柱子可见性 [英] PrimeFaces restore colomn visibility

问题描述

我有一个< p:datatable> ，其中有一些p:column，尤其是一个< p:columns> .

I have a <p:datatable> in which there is some p:column and particularly one <p:columns>.

我还使用一个< p:columnToggler> 来允许用户显示或隐藏列.记住他的选择并不困难，这是动态地恢复他的选择，这是一个问题，尤其是对于< p:columns> 来说，因为< p内的列没有get/set:列> .我也在使用分页，而columntoggler + pagination不是朋友.

I'm also using one <p:columnToggler> to let user to display or hide column. Memorize his choices is not difficult, it's to restore dynamically his choice which is a problem, especially for <p:columns> because there is no get/set for column inside <p:columns>. I'm also using a pagination and columntoggler+pagination are not friends.

为< p:dataTable> 切换器恢复用户选择的最佳方法是什么?

What is the best way to restore users choices for a <p:dataTable> toggler ?

我使用PrimeFaces 5.1.

I use PrimeFaces 5.1.

推荐答案

对不起，我忘了精确说明:我使用的是Primefaces 5.1

Sorry i forgot to precise : i'm on primefaces 5.1

我找到了解决方案！第一次，我将p:columns放在p:column内的p:datatable中，并且可以正常工作！columntoggler更改整个列的可见性.所以我无法隐藏每列的列...但是我也使用分页和columntoggler/pagination不能很好地协同工作...我可以隐藏一列，但是如果我在datatable中更改页面(使用分页器)，该列将重新显示为空！但是，如果我刷新整个页面，则分页器可以正常工作...

I found my solution ! In a first time, I put my p:columns inside a p:datatable which is inside a p:column and it's work ! The columntoggler change visibility of this whole column. So i can't hide column per column... But i also use the pagination and columntoggler/pagination didn't work very well together... I can hide a column but if i change my page (using the paginator) in datatable, the column will re-appear empty ! But if i refresh the whole page, the paginator work correctly...

这就是为什么我使用解决方案的这一部分的原因: Primefaces ColumnToggler不能用于分页

that's why i used this part of solution : Primefaces ColumnToggler does'nt work with pagination

精确地用于检查/取消检查列可见性的脚本.

Precisely a script to check/uncheck column visibility.

<script>
      function updateToggles(widget){
         $( widget.jqId + ' .ui-chkbox .ui-chkbox-box').each(function() {
            var chkbox = $(this);
            if(chkbox.hasClass('ui-state-active')) {
               widget.check(chkbox);
            } else {
               widget.uncheck(chkbox);
            }
         });
      }
      </script>
<p:dataTable
         id="datatable-factures"
         value="#{listFactureHandler.table}"
         var="facture"
         label="Facture"
         nativeElements="true"
         paginator="true"
         rowKey="#{facture.id}"
         rowSelectMode="checkbox"
         selection="#{listFactureHandler.selection}"
         sortBy="#{facture.dateFacture.time}"
         sortOrder="descending">
         <f:facet name="header">
            <p:commandButton id="toggler" type="button" value="Personnaliser" style="float:right;" />
            <p:columnToggler widgetVar="columnToggler" id="columnToggler" datasource="datatable-factures" trigger="toggler" ><p:ajax event="toggle" listener="#{dsHandler.onToggleColumn}"/></p:columnToggler>
            <p:ajax event="page" oncomplete="updateToggles(PF('columnToggler'))"/>
         </f:facet>
         <p:ajax event="toggleSelect" update=":formulaire:insert-actions" />
         <p:ajax event="rowSelectCheckbox" update=":formulaire:insert-actions" />
         <p:ajax event="rowUnselectCheckbox" update=":formulaire:insert-actions" />
         <p:column selectionMode="multiple" styleClass="text-center" toggleable="false" />
                         [...]
         <p:column id="columns-champs-perso" headerText="Champs Personnalisés" visible="false">
  <p:dataTable id="subfacture" value="#{facture}">
     <p:columns headerText="#{champs.libelle}" id="champspersos#{index}" value="#{listFactureHandler.dossier.champsPersonnalises}" columnIndexVar="index" var="champs">
        <h:outputText value="#{facture.getChampPersonnalise(champs.code).valeur}" />
     </p:columns>
  </p:dataTable>

处理程序(dsHandler)存储数据表状态.在预渲染时，我会执行以下操作:

An handler (dsHandler) memorize datatable states. On pre-rendering, i do something like that :

Map<String, Boolean> map = objlState.getColumnsVisibles();
for (String id : map.keySet()) {
   Column objCol = (Column) FacesContext.getCurrentInstance().getViewRoot().findComponent(id);
   if (objCol != null) {
      objCol.setVisible(map.getOrDefault(id, true));
   }
}

我记住列ID，而不是索引，因为columntoggler返回columnIndex + visibility，并且不注意未呈现的列.(但datatable.getChildCount()返回列号，并照顾未呈现的列.

I memorize columns id, not indexes because columntoggler return columnIndex+visibility and did not pay attention to columns which are not rendered. (but datatable.getChildCount() return column number and take care of not rendered columns.

希望对一天的人有帮助；)

In hope that will help someone a day ;)

这篇关于PrimeFaces恢复柱子可见性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！