java - 事件发生时动态显示 panelGroup (JSF/ICEFACES)

Question

我想动态显示一个 panelGroup。

在这段代码中，我有可以填充的框。当最后一个可用的框被数据填满时，应该会出现一个带有一组新框的 panelGroup。

<ice:panelGroup binding="#{myPage.boxes0to9}" />
<ice:panelGroup binding="#{myPage.boxes10to19}" />

如何让第二个 panelGroup 仅在 #{myPage.boxes0to9} 中的最后一个框已填充时显示？

谢谢！

Answer 1

您可以通过用 div 包装<ice:panelGroup>并通过 javascript 检查显示/隐藏它来实现它：

<script type="text/javascript">
    var arrInputs = new Array(9);
    function checkInputsFulfilled(value, index) {
        arrInputs[index] = (value == "");
        var filled = true;
        for(var i = 0; i < arrInputs.length; i++) {
            if (arrInputs[i]) {
                filled = false;
                break;
            }
        }
        document.getElementById("myDiv").style.display = filled ? "block" : "none";
    }
</script>

<ice:panelGroup binding="#{myPage.boxes0to9}">
    <!-- your 9 inputs (or more) here, I'll write 1 as a sample -->
    <h:inputText value="#{myBean.attribute1}" onchange="checkInputsFulfilled(this.value, 0);" />
</ice:panelGroup>
<div id="myDiv" style="display:none">
    <ice:panelGroup binding="#{myPage.boxes10to19}">
    </ice:panelGroup>
</div>

您也可以使用 ajax 支持并呈现一个包装第二个的 JSF 组件，<ice:panelGroup>但是当您只清空一个您的起始输入并且该组应该隐藏时，这将产生很大的影响。当然，这最后一个行为是在 javascript 中控制的，如果你不想让它修改它:)。