p:remoteCommand在异步模式下不起作用 [英] p:remoteCommand not working in async mode
问题描述
如果有人可以在这里给我帮助，我将不胜感激.
I would appreciate if somebody could give me a help here.
我在页面上有一个选项卡式布局，通过单击一个选项卡(p:commandLink)，我想为该选项卡初始化适当的数据并更新显示内容的区域.因为我希望初始化延迟(呈现选项卡内容时)发生，所以我使用的是Primefaces的p:remoteCommand.
I am having a tabbed layout on a page where by clicking on a tab (p:commandLink) I would like to initialize appropriate data for that tab and update the region displaying the content. As I want the initialization to happen lazily (when tab content is rendered), I am using Primefaces's p:remoteCommand.
问题是，当我将p:remoteCommand设置为异步工作(async = true)时，此功能不起作用，未调用action方法.如果属性"async"为false，则可以使用.
The problem is that when I set the p:remoteCommand to work asynchronously (async=true), this functionality is not working, the action method is not called. When attribute 'async' is false, it works.
示例:
<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'为假，则可以使用.
When async="true", it doesn't work, testbean.init() method is not called on link click. When 'async' is false, it works.
我不确定异步"是否适用于这种类型的用例，否则我误解了.
I am not sure whether 'async' is intended for this type of use case, or I misunderstood it.
背景: 在我的应用程序中，实际上我想在选项卡更改时更新多个区域.每个区域都有其自己的初始化方法，该方法从数据库中提取适当的数据.我想要异步调用这些初始化方法的原因是，我不希望其他初始化方法等待第一个初始化方法完成，然后再等待第二个初始化方法完成，等等.所有这些方法都是相互独立的，因此没有它们之间同步的原因.最终，这应该加快向用户显示页面内容的速度.
Background: In my application, I actually have multiple regions I want to update on tab change. And each region has its own initialization method that pulls the appropriate data from the database. The reason I want to have async calling of these initialization methods is that I do not want other initialization methods to wait for the first one to complete, and then the second one to complete etc. All those methods are mutually independent, so there is no reason for the synchronization between them. Ultimately, this should speed up displaying the page content to the user.
感谢您的任何帮助！
推荐答案
我遇到了完全相同的问题，并通过将p:remoteCommand替换为隐藏的p:commandLink来解决了该问题.然后没有name属性，因此您需要使用JavaScript单击链接.
I had the exact same problem and worked it around by replacing p:remoteCommand with a hidden p:commandLink. Then there is no name attribute, so you need to use JavaScript to click the link.
(...)
<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>
(...)
这篇关于p:remoteCommand在异步模式下不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
