Question

Primefaces v3.5

尝试在ajax请求结束时以编程方式使用RequestContext.getContext().scrollTo("")滚动到我的表单。

XHTML摘要：

<h:form id="genericMessagesForm">
                    <p:messages id="genericMessages" />
                </h:form>
<p:commandButton id="testButton" 
            value="Test" process="#{cc.attrs.itemName}Final, @this"
                actionListener="#{myBean.methodCalledByAjax()}" />

豆：

public void methodCalledByAjax() {
    List<String> updateTargets = new ArrayList<String>();
                updateTargets.add("currentRecordForm");
                updateTargets.add("genericMessagesForm");
                RequestContext.getCurrentInstance().update(updateTargets);
                RequestContext.getCurrentInstance().scrollTo("genericMessagesForm");
}

更新工作。

ScrollTo 不工作（相同ID！）。

没有抛出服务器错误。

没有抛出javascript控制台错误。

浏览器尝试过： Firefox（最新），Chrome（最新），IE8。

Answer 1

你看过文档了吗？以下是RequestContext#scrollTo() javadoc：

的引用

scrollTo

public abstract void scrollTo(String clientId)

在ajax请求完成后滚动到组件。

参数：

clientId - 组件的客户端标识符。

看，它说客户端ID，而不是组件ID。这也很有意义，滚动工作最终由JavaScript通过document.getElementById()和朋友完成。这仅适用于客户端ID。

对于没有记住整个NamingContainer事物的初学者来说，通过右键单击查看源来查看JSF生成的HTML输出的简单方法是找出正确的客户端ID在webbrowser中。

对于

<h:form id="genericMessagesForm">
    <p:messages id="genericMessages" />
</h:form>

因此就像

<form id="genericMessagesForm" ...>
    <div id="genericMessagesForm:genericMessages" ...>
        ...
    </div>
</form>

因此，请相应地修复呼叫：

requestContext.scrollTo("genericMessagesForm:genericMessages");

顺便说一句，如果表单只包含<p:messages>，那么您也可以完全摆脱整个表单。 <p:messages>不是EditableValueHolder也不是ActionSource组件，因此不需要放在UIForm组件中。这样您就可以继续使用初始尝试。

另见：

How to find out client ID of component for ajax update/render? Cannot find component with expression "foo" referenced from "bar"

Primefaces RequestContext scrollTo不起作用

1 个答案:

scrollTo

参数：

另见：