無法在Primefaces中顯示對話框RequestContext.execute（）調用

Question

我有一個tabview，我希望在用戶選擇該選項卡時刷新一個特定選項卡的內容。我還希望模式對話框在標籤刷新時彈出。

這裏是TabView的與tabChange AJAX事件處理

<p:dialog widgetVar="statusDialog" modal="true" draggable="false" minimizable="false" appendToBody="true" closable="false" header="Processing..." resizable="false" maximizable="false"> 
    <p:graphicImage library="assets" name="ajax-loader.gif"></p:graphicImage> 
</p:dialog> 

<p:tabView id="tabview" orientation="top" dynamic="false"> 
    <p:ajax event="tabChange" listener="#{bean.tabChangeListener}"></p:ajax> 
    <p:tab title="tab1"> 
     <ui:include src="/WEB-INF/views/tab1.xhtml"/> 
    </p:tab> 
    <p:tab title="tab2"> 
     <p:remoteCommand actionListener="#{bean.refreshData}" update="someTab2ElementID" name="refresh" global="true" onstart="statusDialog.show()" oncomplete="statusDialog.hide()"/> 
     <ui:include src="/WEB-INF/views/tab2.xhtml"/> 
    </p:tab> 
</p:tabView> 

這裏是tabChangeListener：如預期

public void tabChangeListener(TabChangeEvent event) { 
    if (event.getTab().getId().equalsIgnoreCase("tab2")) { 
       RequestContext.getCurrentInstance().execute("refresh()"); 
    } 
} 

刷新remoteCommand被調用，但永遠不會顯示我的statusDialog。如果通過按鈕觸發相同的remoteCommand，則會出現statusDialog。 JavaScript控制檯中沒有錯誤。

爲什麼當remoteCommand由RequestContext.execute（）觸發時，statusDialog不顯示？我怎樣才能讓它顯示？我甚至嘗試添加statusDialog.show（）來執行（），但它沒有幫助。

Answer 1

我想通了。這裏是解決方案：

<h:outputScript> 
var blockCount=0; 
function showStatus() { 
if (blockCount==0) statusDialog.show(); 
blockCount++; 
}; 
function hideStatus() { 
blockCount--; 
if (blockCount==0) statusDialog.hide(); 
}; 
</h:outputScript> 

<p:ajaxStatus onstart="showStatus();" onsuccess="hideStatus();" onerror="blockCount=0;statusDialog.hide();errorDialog.show();"/> 

<p:remoteCommand actionListener="#{bean.refreshData}" update="someTab2ElementID" name="refresh" global="true" onstart="showStatus()" oncomplete="hideStatus()"/> 

顯然爲什麼沒有顯示我的狀態對話框的原因是，另一個Ajax調用完成，並呼籲statusDialog.hide（），而我的刷新（）的事情是怎麼回事。上面的JS代碼維護着一個正在進行多少個Ajax調用的計數器，並且只有在所有調用完成後纔會隱藏狀態對話框。現在按預期工作！

Answer 2

如果你想顯示對話框，當一個特定的標籤被改變，你可以告知一個js函數，該選項卡中選擇的控制，這是2或不通過Ajax響應添加一個回調參數：

public void tabChangeListener(TabChangeEvent event) { 
    if (event.getTab().getId().equalsIgnoreCase("tab2")) { 
       RequestContext.getCurrentInstance().addCallbackParam("index", 2); 
    } 
} 

及用途：

<p:ajax event="tabChange" listener="#{bean.tabChangeListener}" 
    oncomplete="showOrNot(xhr,status,args)"></p:ajax> 

這將調用JS功能，它會控制該改變的標籤是2或不：

function showOrNot(xhr,status,args) { 
    if(args.index==2) { 
     statusDialog.show(); 
    } 
} 

或不同的方法定義的值，並使用p:dialog的visible屬性：

public void tabChangeListener(TabChangeEvent event) { 
     if (event.getTab().getId().equalsIgnoreCase("tab2")) { 
        this.condition=true; 
     } 
    } 

而且<p:dialog visible="#{bean.condition}"/>。也許你需要專注於你的第一個辦法，你可以給一個ID p:dialog並通過p:remoteCommand更新：

<p:remoteCommand actionListener="#{bean.refreshData}" update="someTab2ElementID dialog" name="refresh" global="true" onstart="statusDialog.show()" oncomplete="statusDialog.hide()"/> 

不要忘了給對話框的確切客戶端ID在p:remoteCommand更新屬性。