리치 스킨의 모든 체크 박스를 선택하십시오.

Question

트리 노트의 모든 항목을 체크하는 체크 박스를 만들려고합니다. 나는 JSF에 익숙하지 않기 때문에 테이블 대신 트리에서 이것을 구현하는 방법으로 난처한 편이다.

<rich:panel style="width:400px;">   
      <h:selectBooleanCheckbox id="vehicleAll" onclick="selectAllModel(this.checked);"> 
      </h:selectBooleanCheckbox> 
      <h:outputText value=" ALL"/> 
     <rich:tree id="vehicleTree" switchType="client" 
      value="#{applicationScope.demoModelGrpList}" var="node" ajaxKeys="#{null}" 
      binding="#{demoRptController.vehicleUiTree}" 
      nodeSelectListener="#{demoRptController.selectionListener}" 
      changeExpandListener="#{demoRptController.expansionListener}" 
      ajaxSubmitSelection="true"> 
      <rich:treeNode id="modelNode" ajaxSingle="true" 
       icon="/images/pixel_node.gif" iconLeaf="/images/pixel_node.gif"> 
       <h:selectBooleanCheckbox id="cbxNode" value="#{node.selected}" style="position:relative; float:left; left:-22px;" class="vcBx"> 
       </h:selectBooleanCheckbox> 
       <h:outputText value="#{node.name}" style="position:relative; float:left; left:-16px;"/> 
      </rich:treeNode> 
     </rich:tree> 
    </rich:panel> 

스크립트는 다음과 같습니다 : 이것은 현재 코드

<script type="text/javascript"> 
<![CDATA[ 
function selectAllModel(checks) { 
    alert("calling select all"); 
    var array = document.getElementsByTagName("input"); 
    for(var i = 0; i < array.length; i++) 
    { 
     if(array[i].type == "checkbox") 
     { 
      if(array[i].className == "vcBx") 
      { 
      array[i].checked = checks; 
      } 
     } 
    } 
} 
    ]]> 
</script> 

내가 테스트 목적으로이 경고를 배치; 그것은 심지어 불려지지 않고있다. 나는 이것이 내 머리를 긁적 이도록 내 구문이 정확하다는 것을 확신한다.

Answer 1

동일한 문제가있는 사람의 이익을 위해 내 자신의 질문에 대답하십시오.

분명히 함수 이름으로 select를 사용할 수 없습니다. 그것은 하나의 문제를 해결합니다. 간단히 함수의 이름을 바꾸고 호출해야합니다.

다른 (체크 박스가 선택되지 않음) 문제를 해결하려면 treenode에서 생성되는 특정 ID를 찾아야했습니다. 노드 인덱스와 관련하여 한 자리 만 변경된다는 것을 알기 위해 아래에 지정된 루프를 설정하여 하나씩 체크 박스를 선택하고 모두 확인란의 상태에 따라 변경합니다. 다소 복잡하지만, 수행해야 할 작업을 만족시키기 위해 내가 찾은 최선의 방법입니다. 내 실험에서 입력 또는 입력란으로 선택하면 h : selectBooleanCheckbox를 잡는 데는 효과가없는 것 같습니다. 이 문제가 잘못되면 저를 바로 잡으십시오.

또는 노드의 id를 사용하여 indexOf를 사용할 수 있지만 선택된 모든 부모 노드 만 필요하고 모든 자식 노드도 선택해야하므로 모든 자식 노드가 선택됩니다.

function ccAllModel(checks) { 
    for (var i = 0; i < 9; i++) { 
     var vehicleId = "demoRptForm:vehicleTree:" + i + "::cbxNode"; 
     var array = document.getElementById(vehicleId); 
     array.checked = checks.checked; 
    } 
}