2016-06-02 9 views
0

Primefaces가있는 xhtml 페이지에서 FontAwesome 아이콘 (fa-check)과 함께 눈금 아이콘을 표시하고 싶습니다. icon 속성은 primefaces 버튼이나 primefaces commandButton에 추가 될 수 있기 때문에 icon 속성과 함께 commandButton을 사용합니다. 나는 F를 가진 다른 요소에서 참조하는 경우 내 문제가있다 : 아약스 렌더링,이 오류가 : 이미 질문이 종류가 있다고 알고JSF의 다른 요소에서 요소의 렌더링 새로 고침

malformedXML: During update formId:tickIcon not found

,하지만 난 오프 수행하지 않았다 문제를 해결하십시오. 여기

내 XHTML 페이지의 관련 부분은 다음과 같습니다

<h:form id="formId" enctype="multipart/form-data"> 
     <p:wizard> 
      <p:tab id="tab1"> 
      ... 
      </p:tab> 
      <p:tab id="tab2"> 
      <p:panel> 
       <p:panelGrid styleClass="ui-panelgrid-blank"> 
       <p:row> 
        <p:column colspan="2"> 
        <p:outputLabel id="wrapperLabel" value="Select a file" 
        styleClass="wrapperLabel"> 
         <h:inputFile id="fileUpload" styleClass="fileUploadButton" 
         value="#{bean.file}" required="true"> 
         <f:ajax listener="#{bean.tempUpload()}" 
         render="showFileName createButton tickIcon" /> 
         </h:inputFile> 
        </p:outputLabel> 
       </p:column> 
       <p:column colspan="1"> 
        <p:outputLabel value="Filename: " /> 
       </p:column> 
       <p:column colspan="5"> 
        <p:inputText id="showFileName" 
        value="#{bean.fileName}" readonly="true" /> 
       </p:column> 
       <p:column colspan="1"> 
        <p:commandButton id="tickIcon" icon="fa fa-check" 
        disabled="true" styleClass="tickIcon" 
        rendered="#{bean.validFile}" /> 
       </p:column> 
       </p:row> 
      </p:panelGrid> 
     </p:panel> 
     </p:tab> 
    </p:wizard> 
</h:form> 
가 H에 의해

더 많은 콘크리트 : 아약스, 파일 업로드가 완료되면, 그것이 InputText]를의 렌더링을 새로 고칩니다 : 한 F가 입력 파일 필드와 2 개의 commandButtons. validFile은 부울 변수이며 파일 업로드 후 true입니다. 그러나 아이콘이있는 commandButton에 의해 업데이트는 작동하지 않지만 다른 2 개에서는 작동하지 않습니다.

Fontawesome 아이콘을 표시하는 데 더 좋은 아이디어가 있다면 누구나 환영합니다. 그것이 작동하기 때문에, 거의

<f:ajax listener="#{bean.tempUpload()}" 
          render="showFileName createButton :tickIcon" /> 

:

UPDATE : 내가있는 명령이 방법을 참조하는 경우 그것은 "거의"작동

: tickIcon를, 그래서 아약스 구성 요소에 의해 나는이 쓰기 마법사의 이전 탭으로 돌아가서 다시 돌아올 때만 가능합니다. 구성 요소는 처음에 업데이트되지 않습니다.

업데이트 2 : 그래서 전체 형태가 업데이트

<f:ajax listener="#{bean.tempUpload()}" 
          render="@form" /> 

: 그것은 지금 작동

, 내가 코드 이런 식으로 변경되었습니다.

답변

0

올바르게 이해한다면 열을 ID로 지정하고 단추 대신 해당 ID를 업데이트해야합니다. 문제는 DOM에 존재하지 않는 컴포넌트 (자바 스크립트에서 발생)를 업데이트 할 수 없다는 것입니다.

정상적인 "속임수"는 h:panelGroup에 구성 요소를 넣고 업데이트하는 것이지만, 귀하의 경우에는 p:column을 업데이트 할 수 있다고 생각합니다.

+0

이 방법으로도 작동하지 않습니다. –