머리글에 단추를 추가 할 때 아코디언 패널이 접히지 않도록하려면 어떻게해야합니까?

Question

아코디언 패널에 문제가 있습니다. 나는이 비슷한 아코디언 한 :

<p:accordionPanel> 
    <p:tab title="tabTitle"> 
     <f:facet name="title"> 
      <!-- problematic button --> 
      <p:commandButton value="button"/> 
     </f:facet> 
     <h:PanelGrid> 
      <p>Accordion content</p> 
     </h:panelGrdi> 
    </p:tab> 
</p:accordionPanel> 

문제는 - 내가 버튼을 클릭하면, 전체 아코디언 탭 붕괴됩니다.

제 질문은 : 단추 클릭으로 아코디언이 붕괴되는 것을 방지하는 방법은 무엇입니까? 동시에 아코디언을 머리글을 클릭 할 때 붕괴시키고 싶습니다. 그러나 버튼 외부에 있습니다.

나는 PrimeFaces 5.3과 JSF 당신의 헤더 2.2.11

Answer 1

은이 @JorgeCampos에 의해 제안 된 것처럼 - 우리가 아코디언에 버튼에서 이벤트에 "거품"을 방지하기 위해 event.stopPropagation()를 사용할 수 있습니다. 우리는 물론 다른 뭔가를 다른 이벤트를 사용하거나 ManagedBean은에서 메소드를 호출하는 actionListener을 사용할 수 있습니다

<p:accordionPanel> 
    <p:tab title="tabTitle"> 
     <f:facet name="title"> 
      <p:commandButton value="button" onclick="event.stopPropagation();"/> 
     </f:facet> 
     <h:PanelGrid> 
      <p>Accordion content</p> 
     </h:panelGrdi> 
    </p:tab> 
</p:accordionPanel> 

, update를 사용 : 코드 사용법은 다음과 같이 보이는 것이다 질문에 게시. 예를 들어

<p:commandButton 
    value="button" 
    onclick="event.stopPropagation();" 
    oncomplete="PF('someDialog').show();" <!-- open dialog by js --> 
    actionListener="#{someBean.someMethod}" <!-- call java method --> 
    update="someComponent" <!-- update component --> 
/> 

을 stoping 이벤트 전파

Answer 2

때어 모든 이벤트 한 다음 다시 구성 요소의 init 메소드를 호출 바인딩을 사용하고 있습니다.

<p:accordionPanel widgetVar="myAccordion"> 
    <p:tab title="tabTitle"> 
    <f:facet name="title"> 
     <!-- problematic button --> 
     <p:commandButton value="button" 
      onclick="PF('myAccordion').jq.find('.ui-accordion-header').unbind()" 
      oncomplete= "PF('myAccordion').init(PF('myAccordion').cfg)"/> 
    </f:facet> 
    <h:PanelGrid> 
     <p>Accordion content</p> 
    </h:panelGrdi> 
    </p:tab> 
</p:accordionPanel>