如何使用JSF显示/隐藏组件？

Z时代
2024-01-10
分类：问答

如何使用JSF显示/隐藏组件？我目前正尝试在javascript的帮助下做同样的事情，但没有成功。我不能使用任何第三方库。

谢谢| 阿比

回答：

通常，您需要通过其clientId获得该控件的句柄。本示例使用带有请求范围绑定的JSF2

Facelets视图来获取另一个控件的句柄：

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html">
  <h:head><title>Show/Hide</title></h:head>
  <h:body>
    <h:form>
      <h:button value="toggle"
               onclick="toggle('#{requestScope.foo.clientId}'); return false;" />
      <h:inputText binding="#{requestScope.foo}" id="x" style="display: block" />
    </h:form>
    <script type="text/javascript">
      function toggle(id) {
        var element = document.getElementById(id);
        if(element.style.display == 'block') {
          element.style.display = 'none';
        } else {
          element.style.display = 'block'
        }
      }
    </script>
  </h:body>
</html>