PrimeFacesのさまざまなコンポーネントのAjaxステータスが異なります

Question

私のWebページでは、モーダル1のグローバルAjaxステータスを使用しています。つまり、ajax呼び出しがあると、ユーザーは他のアクションの実行をブロックされ、強制的に待機します。ここのように：

http://www.primefaces.org/showcase-labs/ui/ajaxStatusScript.jsf

しかし、そのような行動は、ページ上のすべてのコンポーネントのために望ましくありません。たとえば、オートコンプリートの場合、オートコンプリートコンポーネントのすぐ隣にノンブロッキングのものを置く方がいいでしょう。 RichFacesには、オートコンプリートコンポーネントによるステータス属性がありました。

PrimeFaces（3.4 SNAPSHOT）では、ページ上の2つの異なるajaxステータスを必要に応じて個別にトリガする方法がありますか？

おかげで、 ルーカス

Answer 1

あなたがajaxStatusをトリガするかどうかをグローバル属性を使用することができます。例えば、偽それを設定すると、このようajaxStatusをトリガしません。

<p:autoComplete id="acSimple" value="#{autoCompleteBean.txt1}" 
completeMethod="#{autoCompleteBean.complete}" global="false"/> 

あなたはAjaxで更新している他のコンポーネントのために。

<p:inputText value="#{autoCompleteBean.txt1}"> 
    <f:validateLength minimum="2" /> 
    <p:ajax global="false" update="email" event="keyup"/> 
</p:inputText> 

UPDATE：あなたはこのようないくつかのことを行うことができます

<p:dialog widgetVar="status" modal="true" closable="false"> 
    Please Wait 
</p:dialog> 

<p:inputText value="#{autoCompleteBean.txt1}"> 
    <f:validateLength minimum="2" /> 
    <p:ajax global="false" onstart="status.show()" oncomplete="status.hide()" update="email" event="keyup"/> 
</p:inputText> 

Answer 2

がPrimefaces 5.1ではあなたはラヴィさんとの警告が表示されます：あなたは2つのステータスをしたい場合は、このような独自のダイアログを書くのですかソリューションとそれは動作しません。

27-Mar-2015 14:35:41.877 WARNING [http-apr-8080-exec-2] org.primefaces.component.autocomplete.AutoCompleteRenderer.encodeScript The process/global/onstart/oncomplete attribute of AutoComplete was removed. Please use p:ajax with the query event now 

Primefaces 5.1の正しい解決策は、オートコンプリートタグ内

<p:ajax event="query" global="false"/> 

を追加することです。

Answer 3

私は、これは（スーパーシンプルでありながら非常に柔軟ではない）私の解決策だった同じ問題を抱えていた：

あなたはページの一部のためのロードIndikatorを追加したい場合は、2つの<h:panelGroup>要素、のための1つを追加する必要がありますローディングインジケータとロードされたコンテンツのインジケータ。

例えば：

<h:panelGroup styleClass="contentPreview content"> 
     <h:outputText id="previewText" styleClass="updatePreview" value="#{lazyResultBean.previewContent}" /> 
    </h:panelGroup> 
    <h:panelGroup styleClass="contentPreview loading"> 
     <p:graphicImage style="width: 15px; height: 15px;" name="/images/ajax-loader.gif" /> 
    </h:panelGroup> 

重要なのは、コンテンツのための正しいstyleClassののloadingロードインジケータとcontentのために設定することです。 両方のパネルには、共有するクラス（この場合はcontentPreviewクラス）が必要です。

インジケータとコンテンツの読み込みを切り替えるには、JavaScript関数を呼び出すだけです。 showLoading('.contentPreview')ローディングインジケータ hideLoading('.contentPreview')を表示して、インジケータを非表示にしてコンテンツを表示します。

：よく

function showLoading(clazz) { 
    console.log('showLoading' + clazz); 
    var loadingElements = $(clazz + '.loading'); 
    loadingElements.each(function (index, el) { 
     el.style.display = 'block'; 
    }); 

    var contentElements = $(clazz + '.content'); 
    contentElements.each(function (index, el) { 
     el.style.display = 'none'; 
    }); 
    } 

function hideLoading(clazz) { 
    console.log('hideLoading' + clazz); 
    var loadingElements = $(clazz + '.loading'); 
    loadingElements.each(function (index, el) { 
     el.style.display = 'none'; 
    }); 

    var contentElements = $(clazz + '.content'); 
    contentElements.each(function (index, el) { 
     el.style.display = 'block'; 
    }); 
    }