选中复选框时显示/隐藏面板

汤姆

我想在选中一个复选框时显示一个面板,或者在不选中该复选框时隐藏一个面板。当复选框的值更改时,以下代码可以正常工作。但是,最初(在构建网页时)始终显示面板。由于未选中此复选框,因此不应显示outputLabel(“您好”)。仅在选中复选框后,才应显示文本。所以,这里出了点问题...

这是代码:

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html">
<h:body>

    <h:form id="myForm">
        <h:selectBooleanCheckbox id="myCheckbox" onclick="hideOrShow(this.checked);"/>
        <h:panelGrid id="myPanel" columns="2" >
            <h:outputLabel for="hallo" value="Halli Hallo" />
        </h:panelGrid>
    </h:form>

</h:body>
<script type="text/javascript">
    function hideOrShow(show) {
        var obj = document.getElementById("myForm:myPanel");
        if (show) {
            obj.style.display = "block";
        } else {
            obj.style.display = "none";
        }
    }
</script>

如何解决这个问题?

瓦西尔·卢卡奇(Vasil Lukach)

显示/隐藏面板不需要JavaScript。这是使用ajax的代码版本:

 <h:form>
     <h:selectBooleanCheckbox id="myCheckbox" value="#{helloWorld.checked}">
         <f:ajax event="click" render="myPanel" execute="myPanel" />
     </h:selectBooleanCheckbox>
     <h:panelGroup id="myPanel" layout="block">
         <h:outputLabel value="hi there" rendered="#{helloWorld.checked}" />
     </h:panelGroup>
 </h:form>

和豆

private boolean checked;
public boolean isChecked() {
    return checked;
}
public void setChecked(boolean checked) {
    this.checked = checked;
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

选中复选框时显示组合框-Extjs

来自分类Dev

选中复选框时显示/隐藏div

来自分类Dev

选中复选框并单击图像时突出显示图像

来自分类Dev

未选中复选框时隐藏div

来自分类Dev

显示或隐藏WebGrid的“全部选中”复选框上的按钮

来自分类Dev

如果选中复选框,则显示或隐藏表行

来自分类Dev

仅在选中特定复选框时显示“ div”框

来自分类Dev

在选中复选框时显示数据

来自分类Dev

选中复选框时隐藏/显示行

来自分类Dev

选中复选框时,在iframe中隐藏元素

来自分类Dev

取消选中复选框时显示div

来自分类Dev

选中或取消选中复选框时如何显示吐司?

来自分类Dev

如果复选框已选中,则隐藏复选框

来自分类Dev

材质UI隐藏元素onClick或选中复选框时

来自分类Dev

如果选中了复选框,则显示div,否则隐藏,除非选中了“显示全部”复选框

来自分类Dev

未选中复选框时隐藏输入

来自分类Dev

如果选中多个复选框,如何显示隐藏按钮

来自分类Dev

如果选中复选框,则显示和隐藏div

来自分类Dev

使用JQuery选中复选框时,如何隐藏然后显示多个Div

来自分类Dev

选中复选框时隐藏复选框,否则保持可见

来自分类Dev

选中复选框时显示按钮

来自分类Dev

如何根据选中的复选框数量显示/隐藏元素?

来自分类Dev

复选框在标签内的位置(在悬停或选中时隐藏/显示)

来自分类Dev

对选中复选框时显示/隐藏div的方法进行故障排除

来自分类Dev

在选中和取消选中复选框时显示和隐藏div

来自分类Dev

jQuery隐藏\显示是否选中复选框

来自分类Dev

如果复选框被选中,如何显示/隐藏内容

来自分类Dev

选中复选框时显示数据表中的隐藏列

来自分类Dev

选中特定复选框时如何显示和隐藏 div?

Related 相关文章

  1. 1

    选中复选框时显示组合框-Extjs

  2. 2

    选中复选框时显示/隐藏div

  3. 3

    选中复选框并单击图像时突出显示图像

  4. 4

    未选中复选框时隐藏div

  5. 5

    显示或隐藏WebGrid的“全部选中”复选框上的按钮

  6. 6

    如果选中复选框,则显示或隐藏表行

  7. 7

    仅在选中特定复选框时显示“ div”框

  8. 8

    在选中复选框时显示数据

  9. 9

    选中复选框时隐藏/显示行

  10. 10

    选中复选框时,在iframe中隐藏元素

  11. 11

    取消选中复选框时显示div

  12. 12

    选中或取消选中复选框时如何显示吐司?

  13. 13

    如果复选框已选中,则隐藏复选框

  14. 14

    材质UI隐藏元素onClick或选中复选框时

  15. 15

    如果选中了复选框,则显示div,否则隐藏,除非选中了“显示全部”复选框

  16. 16

    未选中复选框时隐藏输入

  17. 17

    如果选中多个复选框,如何显示隐藏按钮

  18. 18

    如果选中复选框,则显示和隐藏div

  19. 19

    使用JQuery选中复选框时,如何隐藏然后显示多个Div

  20. 20

    选中复选框时隐藏复选框,否则保持可见

  21. 21

    选中复选框时显示按钮

  22. 22

    如何根据选中的复选框数量显示/隐藏元素?

  23. 23

    复选框在标签内的位置(在悬停或选中时隐藏/显示)

  24. 24

    对选中复选框时显示/隐藏div的方法进行故障排除

  25. 25

    在选中和取消选中复选框时显示和隐藏div

  26. 26

    jQuery隐藏\显示是否选中复选框

  27. 27

    如果复选框被选中,如何显示/隐藏内容

  28. 28

    选中复选框时显示数据表中的隐藏列

  29. 29

    选中特定复选框时如何显示和隐藏 div?

热门标签

归档