I use a datatable with 19 columns, 6 of which are hidden to the right of the screen.
When loading the page or when I perform an action like sorting for example, a screen flash effect occurs and it is very unpleasant.
Is there a solution?
Thanks for your help.
Here is the definition of the datable:
Code: Select all
<p:dataTable id="idRefContributeur" widgetVar="widgetRefContributeur" scrollable="true" scrollHeight="92%" scrollWidth="73%" frozenColumns="1"
var="contributeur"
value="#{contributeurManagerBean.colContributeurFacade.listeColContributeur}"
rowKey="#{contributeur.idPk}"
nullSortOrder="-1"
selectionMode="multiple"
editable="true" editMode="cell"
resizableColumns="true"
paginator="true"
paginatorPosition="bottom"
paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {LignesParPage}"
rows="#{contributeurManagerBean.refUtilisateurFacade.lignesPageTabContributeur}">
<f:facet name="header">
<p:outputLabel value="Liste des contributeurs" style="font-size:1.1em" class="bleu"/>
</f:facet>
<p:column style="width:224px">
<f:facet name="header">
<p:commandLink>
<p:outputLabel id="idEnteteGroupe" value="Contributeur" style="margin-left:-45px"/>
<pe:tooltip for="idEnteteGroupe" value="Trier" myPosition="right bottom" atPosition="left top"/>
<p:ajax listener="#{contributeurManagerBean.trierGroupe()}"
update="idRefContributeur"/>
</p:commandLink>
<p:commandLink actionListener="#{contributeurManagerBean.trierGroupe()}" update="idRefContributeur">
<p:graphicImage id="idTriGroupe" value="#{contributeurManagerBean.triGroupePicto}" style="position:absolute; margin-left:7px"/>
<pe:tooltip for="idTriGroupe" value="Trier" myPosition="right bottom" atPosition="right top" adjustX="-8" adjustY="-2"/>
</p:commandLink>
<p:commandLink onclick="#{contributeurManagerBean.sauvegarderInformationsContributeur()}"
oncomplete="PF('widgetFiltreContributeur').show()">
<p:graphicImage id="idFiltreApplique" value="images/#{contributeurManagerBean.filtreContributeurApplique}.png"
class="#{contributeurManagerBean.filtreContributeurApplique}" width="20px" style="position:absolute; margin-left:25px"/>
<pe:tooltip for="idFiltreApplique" value="Filtrer" myPosition="left bottom" atPosition="right top" adjustX="-3" adjustY="3"/>
</p:commandLink>
<p:commandLink>
<p:outputLabel id="idEnteteIntitule" value="Intitulé" style="margin-left:60px"/>
<pe:tooltip for="idEnteteIntitule" value="Trier" myPosition="right bottom" atPosition="left top"/>
<p:ajax listener="#{contributeurManagerBean.trierIntitule()}"
update="idRefContributeur"/>
</p:commandLink>
<p:commandLink>
<p:graphicImage id="idTriIntitule" value="#{contributeurManagerBean.triIntitulePicto}" style="position:absolute; margin-left:7px"/>
<pe:tooltip for="idTriIntitule" value="Trier" myPosition="right bottom" atPosition="right top" adjustX="-8" adjustY="-2"/>
<p:ajax listener="#{contributeurManagerBean.trierIntitule()}"
update="idRefContributeur"/>
</p:commandLink>
<p:commandLink onclick="#{contributeurManagerBean.sauvegarderInformationsContributeur()}"
oncomplete="PF('widgetFiltreIntitule').show()">
<p:graphicImage id="idFiltreAppliqueIntitule" value="images/#{contributeurManagerBean.filtreIntituleApplique}.png"
class="#{contributeurManagerBean.filtreIntituleApplique}" width="20px" style="position:absolute; margin-left:25px"/>
<pe:tooltip for="idFiltreAppliqueIntitule" value="Filtrer" myPosition="left bottom" atPosition="right top" adjustX="-3" adjustY="3"/>
</p:commandLink>
</f:facet>
<p:fragment rendered="#{contributeur.type == 'G'}">
<div class="backgroundGrisMoyen" style="margin-top:-4px; margin-left:-10px; margin-right:-10px; margin-bottom:-4px; padding-left:10px; padding-top:4px; padding-bottom:4px">
<h:outputText value="#{contributeur.libelle}" style="font-weight:bold" class="grisFonce"/>
</div>
</p:fragment>
<p:fragment rendered="#{contributeur.type == 'L'}">
<div>
<p:commandLink id="idDetailLigne" value="#{contributeur.libelle}" style="margin-left:15px"
action="#{contributeurManagerBean.afficherDetailLigne(contributeur)}"
oncomplete="PF('widgetDetailLigne').show()"
update="form">
</p:commandLink>
<pe:tooltip for="idDetailLigne" value="Détail de la ligne" myPosition="center left" atPosition="center right" adjustX="5"/>
</div>
</p:fragment>
<p:fragment rendered="#{contributeur.type == 'T1' or contributeur.type == 'T2'}">
<h:outputText value="#{contributeur.libelle}" style="margin-left:35px" class="bleu"/>
</p:fragment>
<p:fragment rendered="#{contributeur.type == 'T3' or contributeur.type == 'T4'}">
<h:outputText value="#{contributeur.libelle}" style="margin-left:35px; font-weight:bold" class="bleu"/>
</p:fragment>
</p:column>
<c:forEach items="#{contributeurManagerBean.listeColonneAnnee}" var="annee">
<p:column headerText="#{annee}" style="width:76px">
<p:fragment rendered="#{contributeur.type == 'G'}">
<div class="backgroundGrisMoyen" style="margin-top:-4px; margin-left:-10px; margin-right:-10px; margin-bottom:-4px; padding-left:10px; padding-top:4px; padding-bottom:4px">
<h:outputText value=" "/>
</div>
</p:fragment>
<p:cellEditor rendered="#{contributeur.type == 'L'}">
<f:facet name="output">
<div align="right">
<h:outputText value="#{contributeurManagerBean.rechercherMontantContributeur(contributeur, annee)}">
<f:convertNumber pattern="###,###,###,##0.00"/>
</h:outputText>
<h:outputLabel value=" %" rendered="#{contributeur.ligneTaux and annee != contributeurManagerBean.premiereAnnee}"/>
</div>
</f:facet>
<f:facet name="input">
<p:inputText value="#{contributeur.montant}" disabled="#{contributeur.ligneTaux}">
<f:convertNumber pattern="###,###,###,##0.00"/>
<p:ajax event="blur" listener="#{contributeurManagerBean.modifierMontant(contributeur, annee)}" update="idRefContributeur"/>
</p:inputText>
</f:facet>
</p:cellEditor>
<p:fragment rendered="#{contributeur.type == 'T1'}">
<h:outputText value="#{contributeurManagerBean.rechercherTotalContributeur(contributeur, annee)}" style="float:right" class="bleu">
<f:convertNumber pattern="###,###,###,##0.00"/>
</h:outputText>
</p:fragment>
<p:fragment rendered="#{contributeur.type == 'T2'}">
<h:outputText value="#{contributeurManagerBean.rechercherTotalContributeur(contributeur, annee)}" style="float:right" class="bleu">
<f:convertNumber pattern="##0.00 %"/>
</h:outputText>
</p:fragment>
<p:fragment rendered="#{contributeur.type == 'T3'}">
<h:outputText value="#{contributeurManagerBean.calculerTotalGeneralContributeur(annee)}" style="float:right; font-weight:bold" class="bleu">
<f:convertNumber pattern="###,###,###,##0.00"/>
</h:outputText>
</p:fragment>
<p:fragment rendered="#{contributeur.type == 'T4'}">
<h:outputText value="#{contributeurManagerBean.calculerTauxGeneralContributeur(annee)}" style="float:right; font-weight:bold" class="bleu">
<f:convertNumber pattern="##0.00 %"/>
</h:outputText>
</p:fragment>
</p:column>
</c:forEach>
<f:facet name="{LignesParPage}">
<p:spinner id="idNombreLignes" widgetVar="spinnerNombreLignes" value="#{contributeurManagerBean.refUtilisateurFacade.lignesPageTabContributeur}" min="1" maxlength="3" size="1">
<pe:tooltip for="idNombreLignes" value="Lignes par page" myPosition="left bottom" atPosition="right top"/>
<p:ajax event="change" listener="#{contributeurManagerBean.enregistrerLignesPage()}" update="form" />
</p:spinner>
</f:facet>
</p:dataTable>