我将 bool 值输入 <h:inputText>
但我找不到将其放入 rendered
的方法-<h:panelGroup>
的属性.我也没有看到使用 bean 值的方法,因为每次迭代都需要一个单独的值。
这是我的 jsf 代码:
<ui:repeat var="item" value="#{itemBean.items}" id="iterateItems" varStatus="iteration">
<script type="text/javascript">
showItem("#{item.id}","#{iteration.index}");
</script>
<h:inputText id="rendered"/>
<h:panelGroup layout="block" rendered="???">
Iteration #{iteration.index} rendered
</h:panelGroup>
</ui:repeat>
这是我的javascript:
function showItem(item,iteration){
if((clientSideValue==something){
document.getElementById("iterateItems"+":"+iteration+":"+"rendered").value = true;
}
else{
document.getElementById("iterateItems"+":"+iteration+":"+"rendered").value = false;
}
}
最佳答案
JavaScript 在客户端运行并处理从服务器端检索的 HTML DOM 树(在您的特定情况下由 JSF 生成)。因此,JavaScript 期望您想要显示/隐藏的所需 HTML 元素始终存在于 HTML DOM 树中。
JSF 在服务器端运行并根据 JSF 组件树(“ View ”)生成 HTML 代码。当 JSF 组件的 rendered
属性评估为 false
时,不会为给定组件生成任何 HTML 代码,因此 HTML DOM 树中不会有任何内容,因此也没有任何内容将可供 JavaScript 的 document.getElementById()
选择。
您认为这将是解决方案的具体功能需求尚不清楚,因此很难针对您的具体问题提出正确的解决方案。但是如果您绝对肯定显示/隐藏需要在客户端(通过 JavaScript)而不是在服务器端(通过 JSF)执行,那么您应该使用 CSS 的 display
您可以在 block
和 none
之间切换的属性。
这是一个基本的启动示例,假设您最初想隐藏它:
<ui:repeat var="item" value="#{itemBean.items}" id="iterateItems" varStatus="iteration">
<script type="text/javascript">
showItem(#{iteration.index});
</script>
<h:inputText id="rendered" />
<div id="foo#{iteration.index}" style="display:none">
Iteration #{iteration.index} shown
</div>
</ui:repeat>
与
function showItem(index) {
var div = document.getElementById("foo" + index);
if (someCondition) {
div.style.display = "block"; // Show it.
} else {
div.style.display = "none"; // Hide it.
}
}
关于javascript - 如何渲染 h :panelGroup inside ui:repeat based on value from javascript?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13702872/