Question

我有一个JSF页面，其中在调用其他字段的“onchange”事件时动态呈现某些字段。还有一个弹出式面板，单击按钮即可打开。以下是该页面的简化版本：

<h:form id="testForm">
        <h:panelGrid id="testPanel" columns="2">
            <h:inputText id="text0" />
            <h:inputText id="text1">
                <f:ajax event="change" listener="#{popupMBean.renderDynamicData}"
                    render="@form" />
            </h:inputText>
            <h:inputText id="text2" rendered="#{popupMBean.renderDynamic}" />
            <h:inputText id="text3" />
            <a4j:commandButton id="open" value="Open" render="testPopup"
                oncomplete="#{rich:component('testPopup')}.show();" />
        </h:panelGrid>
    </h:form>

    <rich:popupPanel id="testPopup" height="100"
        domElementAttachment="form" header="Test">
        <f:facet name="controls">
            <h:commandButton value="Close"
                onclick="#{rich:component('testPopup')}.hide()"></h:commandButton>
        </f:facet>
        <a4j:outputPanel id="test">
            <a4j:commandButton id="first" value="First" />
            <a4j:commandButton id="second" value="Second" />
        </a4j:outputPanel>
    </rich:popupPanel>

我要求我需要使用键盘遍历所有字段。以下是面临的问题：

当我点击“打开”按钮时，它会显示弹出式面板但是焦点未设置为弹出窗口中的第一个输入元素。
当用户关闭弹出窗口时，焦点应设置为生成弹出窗口的字段或旁边的字段。
调用字段“text1”上的更改事件后，焦点将移回页面上的第一个输入元素，即“text0”，而不是新呈现的字段“text2”。

感谢。

Answer 1

经过各种论坛后，我发现此问题与Rich Faces 4.1（RF-10758）中的错误有关。

通过在popupPanel.js文件中进行更改，Jboss社区已在RichFaces 4.2.3版本中解决了此错误。在 popupPanel.js 中，有一个 processAllFocusElements 函数，用于比较“root”（父窗口）和“this.div”（子窗口）。虽然“root”是一个简单的DOM元素，但“this.div”是一个jQuery元素集合，因此两者之间的比较总是失败。因此，应该写（root！= this.div.get（0））而不是（root！= this.div）。

但是到目前为止我无法迁移到RichFaces 4.2。所以我决定使用以下代码覆盖默认函数 processAllFocusElements ：

jQuery.extend(RichFaces.ui.PopupPanel.prototype, {
        processAllFocusElements: function(root, callback) {
            var idx = -1;
            var tagName;
            var formElements = "|a|input|select|button|textarea|";
            if (root.focus &amp;&amp; root.nodeType == 1 &amp;&amp; (tagName = root.tagName) &amp;&amp;
                // Many not visible elements have focus method, we is had to avoid processing them.
                (idx = formElements.indexOf(tagName.toLowerCase())) != -1 &amp;&amp;
                formElements.charAt(idx - 1) === '|' &amp;&amp;
                formElements.charAt(idx + tagName.length) === '|' &amp;&amp;
                !root.disabled &amp;&amp; root.type != "hidden") {
                callback.call(this, root);
            } else {
                if (root != this.div.get(0)) {
                    var child = root.firstChild;
                    while (child) {
                        if (!child.style || child.style.display != 'none') {
                            this.processAllFocusElements(child, callback);
                        }
                        child = child.nextSibling;
                    }
                }
            }
        }
        }
    )

这解决了原问题中的问题（1），但其他问题仍有待处理。

将重点放在RichFaces 4.1.0中的弹出面板和动态渲染字段上

1 个答案: