Comment faire défiler automatiquement vers un écran choisi dans les primitives en utilisant JSF?

Question

J'ai une page avec un énorme composant arbre (scrollable) et un composant d'édition où je peux éditer le nœud sélectionné. Après avoir modifié le nœud sélectionné dans la fenêtre d'édition, j'ai un événement ajax qui met à jour le composant de l'arborescence.

Mon problème est que l'arborescence est mise à jour à 100% mais le nœud sélectionné est maintenant défilé hors de la vue. Comment puis-je revenir au nœud sélectionné? Ou existe-t-il un moyen de mettre à jour uniquement le nœud sélectionné dans l'arborescence au lieu de mettre à jour complètement l'arborescence?

Answer 1

j'ai rencontré exactement la même situation, voici ma solution, basée sur JavaScript:

$('.scrollable-tree-container').each(function(index) { 
    var position = $(this).find('.ui-state-highlight').position(); 
    if (typeof position != 'undefined') { 
     $(this).scrollTop(position.top + $(this).scrollTop() - 300); 
    } 
}); 

Comment ça marche?

• Spécifiez le conteneur fournissant la barre de défilement
• Rechercher un nœud surligné
• Lire sa position et faire défiler il

Vous pouvez ajouter des sélecteurs supplémentaires pour éviter les effets secondaires sur d'autres composants . J'ai soustrait 300px ici puisque j'avais une hauteur totale d'arbre de 800px. De cette façon, le nœud sélectionné sera quelque part au milieu (et non au-dessus). La vérification non définie n'est nécessaire que si vous ne pouvez pas vous assurer qu'il y a toujours un nœud sélectionné lors de l'appel de la fonction.