p:remoteCommand 在异步模式下不工作答案

【问题标题】：p:remoteCommand not working in async modep:remoteCommand 在异步模式下不工作
【发布时间】：2013-09-01 13:39:23
【问题描述】：

如果有人可以在这里给我帮助，我将不胜感激。

我在页面上有一个选项卡式布局，通过单击选项卡 (p:commandLink) 我想为该选项卡初始化适当的数据并更新显示内容的区域。因为我希望初始化延迟发生（当呈现标签内容时），所以我使用 Primefaces 的 p:remoteCommand。

问题是当我将 p:remoteCommand 设置为异步工作时（async=true），这个功能不起作用，动作方法没有被调用。当属性 'async' 为 false 时，它会起作用。

例子：

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

<h:head>
</h:head>

<f:view contentType="text/html">
    <h:form id="peopleForm">
        <h:panelGroup id="panel1">
            #{testbean.message}
        </h:panelGroup>

        <p:remoteCommand name="lazyInit"
            onstart="console.log('calling init')"
            action="#{testbean.init()}" 
            update=":peopleForm:panel1"
            async="true"
         />

        <script>
        $(function(){
            console.log('before call');
            lazyInit();
            console.log('after call');
        });
        </script>
    </h:form>

    <p:commandLink update=":peopleForm" value="Tab1" action="#{testbean.setMenuSelected('Tab1')}"/>

    <p:commandLink update=":peopleForm" value="Tab2" action="#{testbean.setMenuSelected('Tab2')}"/>
</f:view>
</html>

@ManagedBean(name = "testbean")
@Component("testbean")
@Scope("session")
public class TestBean implements Serializable {

    private static final long serialVersionUID = -2760060999550263904L;

    private String message;
    private String menuSelected = "Tab1";

    public void init() {
        if (menuSelected.equals("Tab1")) {
            message = "Tab1";
        }
        if (menuSelected.equals("Tab2")) {
            message = "Tab2";
        }
    }

    public String getMessage() {
        return message;
    }

    public String getMenuSelected() {
        return menuSelected;
    }

    public void setMenuSelected(String menuSelected) {
        this.menuSelected = menuSelected;
    }
}

当 async="true" 时，它不起作用，链接点击时不会调用 testbean.init() 方法。当 'async' 为 false 时，它可以工作。

我不确定“异步”是否适用于这种类型的用例，或者我误解了它。

背景：在我的应用程序中，我实际上有多个要在选项卡更改时更新的区域。每个区域都有自己的初始化方法，可以从数据库中提取适当的数据。我想要异步调用这些初始化方法的原因是我不希望其他初始化方法等待第一个完成，然后第二个完成等等。所有这些方法都是相互独立的，所以没有他们之间同步的原因。最终，这应该会加快向用户显示页面内容的速度。

感谢您的任何帮助！

【问题讨论】：

标签： jsf jsf-2 primefaces

【解决方案1】：

我遇到了完全相同的问题，并通过将p:remoteCommand 替换为隐藏的p:commandLink 来解决它。那么就没有name属性，所以需要使用JavaScript来点击链接。

(...)

<h:head>
    <script>
        function lazyInitClick() {
            $("[id$='lazyInit']").click();
        }
    </script>
</h:head>

(...)

<h:form>
    <p:commandLink id="lazyInit" actionListener="#{testbean.init()}" async="true" style="display: none;" />
    <h:outputScript>lazyInitClick()</h:outputScript>
</h:form>

(...)

【讨论】：