Прокрутка к выбранному узлу в дереве. Прайсы

Question

Я создал дерево и хотел бы, чтобы прокрутка была для выбранного узла через фильтр. В качестве примера ниже найдены на интернет JSFIDDLE: TreeNodeJsFiddle

Мой код:

<p:accordionPanel id="apFilter"> 

<p:remoteCommand name="remoteFilter" 
    actionListener="#{mybean.searchNode}" 
    update="tree,:form:dataTree, :form:dataTree1, :form:chart" /> 
<p:outputLabel value="Search: " /> 
<p:inputText id="filterTree" value="#{myBean.filter}" 
    style="width:100px" 
    onkeypress="if (event.keyCode == 13) { test(); return false; }" /> 

<p:outputPanel id="scroll" 
    style="width: 100%;height: 100%;overflow: auto;display: block"> 

    <!-- tree --> 
    <p:tree filter="true" value="#{myBean.root}" var="doc" id="tree" 
     style="width:250px; font-size:10px" dynamic="true" cache="false" 
     selectionMode="single" selection="#{myBean.selectedNode}"> 
     <p:ajax event="expand" 
      update=":form:dataTree, :form:dataTree1, :form:chart" 
      listener="#{myBean.onNodeExpand}" /> 
     <p:ajax event="select" 
      update=":form:dataTree1,:form:dataTree, :form:chart" 
      listener="#{myBean.onNodeSelect}" /> 
     <p:ajax event="unselect" 
      update=":form:dataTree,:form:dataTree1,:form:chart" 
      listener="#{myBean.onNodeUnselect}" /> 
     <p:ajax event="collapse" 
      update=":form:dataTree1,:form:dataTree, :form:chart" 
      listener="#{myBean.onNodeCollapse}" /> 

     <p:treeNode type="group1" expandedIcon="ui-icon-folder-open" 
      collapsedIcon="ui-icon-folder-collapsed"> 
      <h:outputText value="#{doc.name}" /> 
     </p:treeNode> 

     <p:treeNode type="group2" expandedIcon="ui-icon-folder-open" 
      collapsedIcon="ui-icon-folder-collapsed"> 
      <h:outputText value="#{doc.name}" /> 
     </p:treeNode> 

     <p:treeNode type="group3" icon="ui-icon-document"> 
      <h:outputText value="#{doc.name}" /> 
     </p:treeNode> 


    </p:tree> 
</p:outputPanel> 

Я попытался с помощью scrollTo в соответствии с рекомендациями по ссылке: http://forum.primefaces.org/viewtopic.php?f=3&t=18856 , однако, не удалось.

public void searchNode() { 
    selectedNode = myBeanRN.searchFilter(filter); 
    RequestContext context = RequestContext.getCurrentInstance(); 
    context.scrollTo("apFilter:tree:"+selectedNode.getRowKey()); 
} 

Кто-нибудь знает, как перейти к выбранному узлу, равному примеру jsFiddle?

Answer 1

я использовал

<p:scrollPanel> 
<p:tree> 
    ... 
</p:tree> 
</p:scrollPanel> 

и JS на дереве выберите элемент

var selectedElement = treeWidgetVar.jq.find('span .ui-state-highlight'); 
if (selectedElement != null && selectedElement != undefined && selectedElement.position() != undefined) { 
    var scrollPanel = treeWidgetVar.jq.parent(); 
    scrollPanel.scrollTop(selectedElement.position().top - scrollPanel.height()/2); 
}