JSF SelectOneMenu onchange, onsubmit 취소 재설정 값

Question

JSF SelectOneMenu에서 ajax 이벤트 onchange가 있으며 확인 질문이 onsubmit 인 경우 사용자가 변경을 중단하면 어떻게하면 SelectOneMenu의 값을 원래 값으로 다시 설정할 수 있습니까? ?

<h:selectOneMenu value="#{bean.selectedFruit}"> 
    <f:selectItems value="#{bean.fruits}"/> 
    <a:support event="onchange" onsubmit="if(!confirm('Are you sure?'))return false;}" action="#{bean.loadFruitStats}" rerender="body"/> 
</h:selectOneMenu> 

따라서 위의 예에서, 때 사용자 No (아니오) '를 확인 대화 상자에서, 조치가 호출되지 클릭하고 다시 쓰게가 호출되지 않습니다, 그래서 SelctOneMenu은 업데이트 된 "과일"이름에하지 원래 하나 (그래서 과일 이름과 과일 통계 정보가 일치하지 않습니다). 동기화하려면 어떻게해야합니까?

Answer 1

h:selectOneMenu은 자바 스크립트를 사용하여 원래 값으로 다시 설정할 수 있습니다.

1. 먼저 당신은 idh:selectOneMenu에 정의해야합니다. 예를 들어

   <h:selectOneMenu id="selFruitId"...> 
   

2. 추가 다음 (자명) 자바 스크립트 JSF 페이지로

   var currentValue; 
   function saveCurrentValue(){ 
       //get html select element 
       var element=document.getElementById("form:selFruitId"); 
       //saves currently selected value 
       currentValue=element.value; 
   } 
   
   function areYouSure(){ 
       if(!confirm('Are you sure?')){ 
        //if canceled, restores previously saved value 
        document.getElementById("form:selFruitId").value=currentValue; 
        return false; 
        } 
   } 
   

3. 는 그런 다음 사용자가 마우스을 (사용 변화 선택된 값을 시도 할 때 순간을 차단해야 onclick 이벤트) 또는 키보드 (onkeypress 이벤트 예 : 상하 커서 키 또는 다른 키) 및 저장 나중에 선택하십시오.

   <h:selectOneMenu id="selFruitId" 
          onclick="saveCurrentValue()" onkeypress="saveCurrentValue()"...> 
   

4. 는 그리고 마지막으로, 아약스를 실행하기 전에 취소하는 경우, h:selectOneMenu에 다시 저장 (원본) 값을 복원합니다 function areYouSure()를 호출해야합니다.

   <h:selectOneMenu value="#{bean.selectedFruit}" id="selFruitId" 
          onclick="saveCurrentValue()" onkeypress="saveCurrentValue()"> 
       <f:selectItems value="#{bean.fruits}"/> 
       <a:support event="onchange" onsubmit="areYouSure()" action="#{bean.loadFruitStats}" rerender="body"/> 
   </h:selectOneMenu>