Come svanire un messaggio dopo un timeout

Question

Ho una semplice pagina di accesso che visualizza un messaggio se il login non ha avuto successo. Vorrei che questo messaggio scomparisse dopo 5 secondi, ma non riesco a farlo funzionare.

La parte di accesso (rimosso la maggior parte della roba irrilevante):

<h:inputText title="Name" value="#{authBean.name}" id="username" /> 
<h:inputSecret title="Password" value="#{authBean.password}" id="password" /> 

<p:commandButton id="loginButton" action="#{authBean.loginAndRedirect}" 
      update="@form" value="Login" /> 
<h:message id="messages" for="login:username" /> 

Quello che ho provato finora:

Il comando inserito nella linea di comando Firebug funziona perfettamente: $('[id$=messages]').fadeOut();

Ora ho bisogno di un modo per attivarlo da un timer:

impostare un callback sul pulsante come questo non funziona (nessun effetto, nessun errore):

<p:commandButton ... oncomplete="setTimeout(5000, '$('[id$=messages]').fadeOut())" ... /> 

ho provato con onclick e oncomplete, ma senza alcun effetto e nessun errore.

provato utilizzando effetti primfaces (effetti JQuery imbustati) sull'elemento message:

<h:message id="messages" for="login:username" errorClass="errorMessage"> 
    <p:effect type="fadeout" event="load" delay="5000"> 
    <f:param name="mode" value="'hide'" /> 
    </p:effect> 
</h:message> 

alcun effetto, nessun errore.

Answer 1

vi state perdendo una chiusura function all'interno setTimeout(). Inoltre, chiamare una funzione è meglio che usare JavaScript in linea. È più facile da leggere e eseguire il debug.

E.g.

<p:commandButton ... oncomplete="fadeoutfunction()" ... /> 

con

function fadeoutfunction(){ 
setTimeout(function(){ 
    $('[id$=messages]').fadeOut(); 
},5000); 
} 

Answer 2

<p:commandButton ... 
oncomplete="setTimeout(function(){$('[id$=messages]').fadeOut()},'5000')" ... />