p : blockUI/pe : blockUI : 간단한 예제에서 왜 작동하지 않습니까?

Question

나는 버튼이 동작이 수행되는 트리거 동안 요소를 숨길 싶습니다

<h:form id="sendtxform"> 
     <p:panelGrid columns="1" styleClass="ui-noborder">  
      <pe:blockUI block="input" widgetVar="blockUIWidget"> 
      LOADING<br /> 
       <p:graphicImage name="images/ajax-loader.gif" /> 
      </pe:blockUI> 

      <p:commandButton id="command" value="ISSUE APP" 
       actionListener="#{transactionXmlController.getTxDataPredefined}" 
       ajax="true" update="growl,input" 
       onstart="PF('blockUIWidget').block();" 
       oncomplete="PF('blockUIWidget').unblock();"> 
      </p:commandButton> 

      <p:inputTextarea id="input" cols="150" rows="30" autoResize="false" 
       value="#{transactionXmlEditableModel.xml}" /> 
     </p:panelGrid> 
    </h:form> 

나는 페이지와 시도 : blockUI/PE : blockUI와 함께 /를 ONSTART 및 onComplete를 속성없이.

내가 뭘 잘못합니까? 나는 다른 곳에서 blockUI를 사용하고 있으며, 잘 작동하고있다 : 유일한 차이점은 테이블이 자체 트리거라는 것이다.

나는 this 튜토리얼을 따랐다.

Answer 1

차단 입력이 작동하지 않는 것처럼 보입니다. 패널로 입력을 감싸 차단할 수 있습니다.

PrimeFaces 확장 :

<h:form id="sendtxform"> 
    <p:panelGrid columns="1" styleClass="ui-noborder"> 
     <pe:blockUI target="panel" widgetVar="blockUIWidget"> 
     LOADING<br /> 
      <p:graphicImage name="images/ajax-loader.gif" /> 
     </pe:blockUI> 

     <p:commandButton id="command" value="ISSUE APP" 
      actionListener="#{transactionXmlController.getTxDataPredefined}" 
      ajax="true" update="input" 
      onstart="PF('blockUIWidget').block();" 
      oncomplete="PF('blockUIWidget').unblock();"> 
     </p:commandButton> 

     <p:panel id="panel"> 
      <p:inputTextarea id="input" cols="150" rows="30" autoResize="false" 
      value="#{transactionXmlEditableModel.xml}" /> 
     </p:panel> 
    </p:panelGrid> 
</h:form> 

PrimeFaces :

<h:form id="sendtxform"> 
    <p:panelGrid columns="1" styleClass="ui-noborder"> 
     <p:blockUI block="panel" trigger="command"> 
     LOADING<br /> 
      <p:graphicImage name="images/ajax-loader.gif" /> 
     </p:blockUI> 

     <p:commandButton id="command" value="ISSUE APP" 
      actionListener="#{transactionXmlController.getTxDataPredefined}" 
      ajax="true" update="input"> 
     </p:commandButton> 

     <p:panel id="panel"> 
      <p:inputTextarea id="input" cols="150" rows="30" autoResize="false" 
      value="#{transactionXmlEditableModel.xml}" /> 
     </p:panel> 
    </p:panelGrid> 
</h:form>