Question

我是Rich Faces的新手，我们正在使用richfaces 4.0。我们的项目中有弹出窗口要求，我们使用了rich：popupPanel 在弹出窗口中，我们有一个包含5到10个输入文本框的表单。

我们正面临以下问题： 选项卡无法运行下一个文本框。

我们使用了tabindex属性，但它在富脸中无效。

有人可以帮我吗？

提前致谢。

Answer 1

以下是Richfaces 4中启用了标签功能的示例弹出式面板：

<script type="text/javascript">
    jQuery('input').live("keypress", function(e) {
        var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
        /* ENTER PRESSED*/
        if (key == 9) {  // 9 for TAB
            /* FOCUS ELEMENT */
            var inputs = jQuery(this).parents("form").eq(0).find(":input");
            var idx = inputs.index(this);

            var move = (e.shiftKey) ? (-1) : (1); // for Shift+TAB

            if (idx == inputs.length - 1) {
                inputs[0].select()
            } else {
                inputs[idx + move].focus(); //  handles submit buttons
                inputs[idx + move].select();
            }
            return false;
        }
    });
</script>

<rich:jQuery query="focus().select()" selector="#thegrid :input:visible:enabled:first" name="focusInput"/>

<rich:popupPanel id="samplepopup" modal="true" resizeable="true" height="220" width="400"
                 onmaskclick="#{rich:component('samplepopup')}.hide()"
                 onshow="focusInput();">

    <f:facet name="header">
        <h:outputText value="sample"/>
    </f:facet>

    <h:form>

        <h:panelGrid id="thegrid" columns="2" style="direction: rtl;">
            <h:outputText value="Current Pass"/>
            <h:inputSecret id="pass1" value="#{userBean.pass}"/>
            <h:outputText value="New Pass"/>
            <h:inputSecret id="pass2" value="#{userBean.newPass}"/>
            <h:outputText value="New Pass Confirm"/>
            <h:inputSecret id="pass3"/>
        </h:panelGrid>
    </h:form>

</rich:popupPanel>

<a4j:commandButton value="show sample" onclick="#{rich:component('samplepopup')}.show()"/>

Answer 2

一般的解决方法可能是覆盖负责的函数：

RichFaces.ui.PopupPanel.prototype.processTabindexes = function (input) {
    if (!this.firstOutside) {
        this.firstOutside = input;
    }
    if (!input.prevTabIndex) {
        input.prevTabIndex = input.tabIndex;
//      input.tabIndex = -1; // This line was marked out
    }
    if (!input.prevAccessKey) {
        input.prevAccessKey = input.accessKey;
        input.accessKey = "";
    }
};

Tabindex不能使用richfaces弹出面板

2 个答案: