JSF와 p : 아약스 내부 p : dataTable inside ui : repeat

저는 RichFaces에 익숙하지만 Primeface에 비교적 익숙하지 않고 내부에 h:graphicImage (추가로 ui:repeat 내부)을 구현하려고합니다. 이는 p:ajax inside h:graphicImage의 후속 질문입니다.JSF와 p : 아약스 내부 p : dataTable inside ui : repeat

내가 직접 행동을 언급 다음 xhtml -code을 분할합니다 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:ui="http://java.sun.com/jsf/facelets" 
     xmlns:p="http://primefaces.prime.com.tr/ui" 
     xml:lang="en" lang="en"> 
    <h:head id="head"> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <title>Test</title> 
    </h:head> 
    <h:body id="body"> 
     <f:view contentType="text/html">

지금 처음 h:form는 h:outputText과 h:graphicImage 포함하는 다음과 같습니다. 이미지를 클릭하면 bean 메소드가 호출되고 카운터이 올바르게 업데이트됩니다. 제 h:form 버튼에

<h:form id="f1"> 
    <h:outputText id="counter" value="#{clientBean.counter}" /> 
    <h:graphicImage url="/images/circle-ok.png"> 
    <p:ajax event="click" update="counter" process="@this" 
      listener="#{clientBean.tag}"/> 
    </h:graphicImage> 
</h:form><hr/>

는 p:dataTable 안에. 이미지를 클릭하면 bean 메소드가 호출되어 카운터가 업데이트됩니다.

<ui:repeat var="var1" value="#{clientBean.list}"> 
    <h:form id="f3"> 
    <h:graphicImage url="/images/circle-ok.png"> 
    <p:ajax event="click" update="f1:counter" process="@this" 
       listener="#{clientBean.tag}" /> 
    </h:graphicImage>

는 이제 ui:repeat 내부 p:dataTable에 올 수 있습니다 :

<h:form id="f2"> 
    <p:dataTable var="var" value="#{clientBean.vf}"> 
    <p:column> 
     <f:facet name="header">Tag</f:facet> 
     <h:graphicImage url="/images/circle-ok.png"> 
     <p:ajax event="click" update="f1:counter" process="@this" 
       listener="#{clientBean.tag}" /> 
     </h:graphicImage> 
    </p:column> 
    </p:dataTable> 
</h:form><hr/>

는 ui:repeated 내부의 이미지는 예상대로 카운터를 업데이트 (firt에서 참고 내가 성공하지 update="counter"에 노력했습니다) . (이 tag() 방법 업데이트하지 카운터의 내부) 나는 <partial-response><changes><update id="f1:counter">...를 얻을이 경우

<p:dataTable var="var2" value="#{var1.list}"> 
     <p:column> 
     <f:facet name="header">Tag</f:facet> 
     <h:graphicImage url="/images/circle-ok.png"> 
     <p:ajax event="click" update="f1:counter" process="@this" 
       listener="#{clientBean.tag}" /> 
     </h:graphicImage> 
     </p:column> 
    </p:dataTable> 
    </h:form> 
</ui:repeat> 
</f:view></h:body></html>

하지만, 빈 메소드가 호출되지 않습니다 :이 코드 조각으로 빈 메소드는 호출되지입니다. 이것은 디버그로 테스트됩니다. 나는 unable to use <p:ajax> on my primeface's datatable 을 읽었지만, 나는 primefaces-3.0.M3.jar과 primefaces-2.2.1.jar을 가지고 같은 행동을했다.

출처

2011-09-06 Thor

이전에는 비슷한 문제가있었습니다. 나는 편집증 일지 모르지만 JSF2의 반복 구성 요소 인 UIData과 UIRepeat이 도청당했습니다. 특히 중첩 될 때 구성 요소 상태를 올바르게 처리하지 못합니다. 나는 UIRepeat 자신을 패치했고 그것은 중첩의 모든 레벨로 나를 위해 작동합니다. tomahawk의 반복적 인 구성 요소가 올바르게 작동한다는 것도 알고 있습니다.

어떤 경우에는 클릭 한 이미지에 관계없이 동일한 동작을 원하기 때문에 합리적으로 간단한 해결 방법이 도움이 될 수 있습니다. 을 만들고 양식 'f1'안에 올바른 ajax 요소와 'update-counter'와 같은 ID를 사용하여 말하십시오. 숨 깁니다. 값이 jsf.ajax.request("f1:update-counter", event, {render: "f1:counter", execute="@this"}) 인 graphicImage에 onclick 속성을 추가하십시오. 첫 번째 인수를 document.getElementById("f1:update-counter")으로 바꿔야 할 수도 있습니다. 확실하지 않습니다. 이 자바 스크립트 API 호출은 숨겨진 commandLink를 클릭하는 것과 동일해야합니다. 또는 commandLink를 건너 뛰고 대신 f1에서 graphicImage id/DOM 노드를 전달할 수도 있습니다.

나는 이것을 f:ajax과 함께 사용했지만, p:ajax도 사용할 수 있습니다.

출처

2011-09-06 09:23:43 mrembisz

해결 방법 제안을 보내 주셔서 감사합니다. 실제로 나는 동일한 행동을 원하지 않는다. 나는이 방법으로 _simple_ 예제로 문제를 설명했다.그러나 bean이 호출되지 않은 이유를 컴포넌트 상태를 처리하는 버그가있는 JSF2의 느낌은 무엇입니까? – Thor

상태 저장 문제는 처리 후 클라이언트 ID를 정리하지 않는 UIData/UIRepeat와 관련이 있습니다. 이로 인해 상태가 반복 인덱스가있는 키 아래에 저장되고 복원 된 구성 요소 ID와 일치하지 않게됩니다. 결과적으로 중첩 된 반복자의 상태가 손실됩니다. 여기에 또 다른 해결책이 있습니다 : ui : repeat를 둘러 싸는 대신 c : forEach를 사용하면 되풀이되는 구성 요소가 중첩되지 않습니다. – mrembisz

JSF에서 JSTL 태그를 사용하는 것이 좋은지 잘 모르겠지만 웹에는 인위적인 토론이 가득합니다. 'c : foreach'와 함께 작동하지만 각 AJAX 요청에 대해 @ViewScoped 빈의'@ PostConstruct' 메소드가 호출되어 실제로 성능이 저하된다는 부작용이 있습니다. – Thor

JSF와 p : 아약스 내부 p : dataTable inside ui : repeat

답변

관련 문제