Primefaces Ajax SelectOneListBox barre de défilement à la position désirée

Question

J'ai une sélection SelectOneListBox avec> 50 articles. Lorsqu'un nouvel élément est ajouté - enregistré, il est ajouté en tant que dernière ligne, qui est en dehors de la zone visible en cours. J'ai besoin que la listbox défile automatiquement jusqu'à la nouvelle ligne ajoutée (qui est sélectionnée).

Le bouton Ajouter-enregistrer et la zone de liste sont ajaxifiés. J'utilise Primefaces 5.0. Comment puis-je faire ceci?

Le code page JSF:

<p:commandButton title="Save" icon="ui-icon ui-icon-disk" > 
    <p:ajax process="name desc @this" 
    update="list msg" 
    listener="#{bean.saveListener}"/> 
</p:commandButton> 

<p:selectOneListbox id="list" scrollHeight="120" 
    value="#{bean.selectName}"> 
    <f:selectItems value="#{bean.data}" var="b" 
    itemLabel="#{b.desc}" itemValue="#{b.name}"/> 
    <p:ajax process="@this" update="@this name desc msg" 
    listener="#{bean.valueChanged}"/>   
</p:selectOneListbox> 

Answer 1

J'ai résolu le problème avec ceci:

a ajouté à bouton de commande p: tag ajax:

oncomplete="autoScroll()" 

inclus ce script:

function autoScroll() { 
    var scrollPos = 400; 
    jQuery('#fm\\:list .ui-selectlistbox-listcontainer').animate({scrollTop:scrollPos}); 
} 

Lorsque je clique sur le bouton ajouter-enregistrer le nouvel élément est ajouté au bas des éléments de la liste et fait défiler vers le bas de la liste. Le défileur se déplace vers le scrollPos spécifié. Comme l'élément ajouté à la liste est la dernière rangée, j'ai utilisé une position de défilement plus grande que nécessaire. Cela marche.