0

ツリーノード内のすべての項目をチェックするチェックボックスを作成しようとしています。私は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>

テスト目的でアラートをそこに配置しました。呼び出されていません。構文が正しいと確信しているので、頭を悩ませています。

4

1 に答える 1

0

同じ問題を抱えている人の利益のために、自分の質問に答えます。

関数名に select を使用できないようです。これで 1 つの問題が解決します。関数の名前を変更するだけで済み、現在は呼び出されています。

他の問題 (チェックボックスが選択されていない) を解決するには、ツリーノードによって生成される特定の ID を調べる必要がありました。ノードのインデックスに関連する変更が 1 桁だけであることを確認して、チェックボックスを 1 つずつ選択し、すべてのチェックボックスのステータスに応じて変更するために、以下に指定されたループをセットアップしました。少し複雑ですが、必要なことを満たすために私が見つけた最良の方法です。私の実験から、入力またはタイプのチェックボックスによる選択は、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;
    }
}
于 2013-07-09T03:46:20.977 に答える