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 作为函数名。这解决了一个问题;我只需要重命名该函数,现在它被调用了。

为了解决另一个问题(未选中复选框),我必须查找由 treenode 生成的特定 id。看到只有一位与节点的索引有关的变化,我设置了下面指​​定的循环以逐个选中复选框并根据 ALL 复选框的状态进行更改。有点令人费解,但这是我发现满足需要做的最好的方法。根据我的实验,通过输入或类型复选框进行选择似乎不适用于抓取 h:selectBooleanCheckbox。如果我对此有误,请随时纠正我。

或者,您可以使用 indexOf 使用节点的 id,但我只需要选择父节点而不需要任何子节点,因为这样做也选择了所有子节点。

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 回答