RichFaces: Anzeige einer Meldung "Popup" bei AJAX-Betrieb

Question

Wir entwickeln derzeit einen B2B-Webshop auf Basis von Java EE 5, JSF, Facelets und RichFaces. Die Technologie hat wirklich sehr gut funktioniert, aber jetzt habe ich ein kleines Problem, ich kann einfach nicht herausfinden, wie zu lösen:

Produkte sind als Tabellen aufgelistet, wo jeder Artikel in den Warenkorb hinzugefügt werden kann Klicken Sie auf ein kleines Symbol am Ende der Zeile. Das Hinzufügen des Produkts erfolgt über AJAX, um das vollständige Neuladen der Seite zu vermeiden. Dies funktioniert problemlos, indem Sie einfach eine h:dataTable und eine a4j:commandLink Aktionsmethode aufrufen, die das ausgewählte Produkt zum Warenkorb hinzufügt. Sogar das erneute Rendern der Korbgesamtmenge, die immer in der Seitenleiste sichtbar ist, funktioniert einwandfrei.

Aufgrund der Natur von AJAX gibt es keinen sichtbaren Hinweis (außer der sich ändernden Summe an der Seite), dass der Vorgang erfolgreich war oder mindestens abgeschlossen wurde. Nun möchte ich eine kleine "Popup" Box hinzufügen, die neben dem Add-Icon sichtbar gemacht wird, wenn der AJAX-Vorgang abgeschlossen ist, und besagt, dass das Objekt zum Warenkorb hinzugefügt wurde. Diese Box sollte nach einigen Sekunden automatisch verschwinden.

Dies ist, was ich denke, sollte arbeiten (die popup_message und popup_content CSS-Klassen die Box schweben über der Position machen, wo seine Markup):

<h:dataTable ....> 
    ... 
    <h:column> 
     <a4j:commandLink action="..."> 
      <rich:effect event="oncomplete" targetId="addedMessage" 
       type="Appear" /> 
      <rich:effect event="oncomplete" targetId="addedMessage" 
       type="Appear" params="{delay:3.0, duration:1.0}" /> 
     </a4j:commandLink> 

     <a4j:outputPanel id="addedMessage" styleClass="popup_message" 
      style="display: none"> 
      <a4j:outputPanel layout="block" styleClass="popup_content"> 
       <h:outputText value="Item added!" /> 
      </a4j:outputPanel> 
     </a4j:outputPanel> 
    </h:column> 
</h:dataTable> 

Leider ist es nicht die Box überhaupt nicht angezeigt werden . Wenn ich den event des "Appear" -Effekts zu onclick ändere, funktioniert es fast wie erwartet. Es wird sofort angezeigt, wenn auf das Symbol geklickt wird und es verschwindet 3 Sekunden nachdem der AJAX-Vorgang abgeschlossen wurde. Aber ich möchte nicht, dass es sofort nach dem Klick erscheint, weil es falsch wäre anzuzeigen, dass der Artikel zum Warenkorb hinzugefügt wurde, obwohl die Operation tatsächlich noch nicht begonnen hat. Dies wird noch wichtiger, wenn ich einen Fehler anzeigen möchte oder einige artikelspezifische Informationen in die Box einfügen möchte, die erst nach dem Hinzufügen des Elements verfügbar ist.

Also irgendwelche Ideen, wie das geht? Und warum funktioniert das Hinzufügen von zwei Effekten für dasselbe Ereignis nicht?

(Ich habe schon bei the effect-example from the RichFaces live demo aussahen. Die Beispiele funktionieren fast die gleiche, execept, dass sie den zweiten Effekt hinzufügen mit explizit unter Angabe des for Attribut. Aber auch das ist für mich nicht funktioniert.)

Update: Ich habe versucht, mit dem rich:toolTip für diesen Zweck, der eigentlich sehr flexibel scheint. Aber egal, was ich tue, ich kann nichts an das "oncomplete" Ereignis anhängen (ich habe es auch nur "komplett" versucht) a4j:commandLink, mit Ausnahme eines Effekts ... scheint es ein Bug/undokumentiertes Verhalten diesbezüglich zu geben Veranstaltung. Ich habe gerade diesen Fehlerbericht gefunden: RF-3427

Answer 1

Ihre definierende Ziel-ID außerhalb der Parameter. Was Sie tun möchten, ist:

<rich:effect event="oncomplete" type="Appear" params="targetId:'addedMessage',delay:3.0, duration:1.0" /> 

Versuchen Sie, und ich denke, es wird funktionieren.

Answer 2

können Sie rich:notify versuchen diese für http://showcase.richfaces.org/richfaces/component-sample.jsf?demo=notify&skin=blueSky

Answer 3

Sie rich:status versucht haben? Ich werde kein Stück Code veröffentlichen. Ich denke, die Dokumente werden gut funktionieren.

http://livedemo.exadel.com/richfaces-demo/richfaces/status.jsf