Funzione onclick processo dopo chiamata ajax <f:ajax>

Question

Sto provando a selezionare e mettere a fuoco l'ID componente selezionato dopo aver inviato un modulo (chiamata ajax).

<script> 
var myFunc = function() { 
    document.getElementById('form:#{bean.componentId}').focus(); 
    document.getElementById('form:#{bean.componentId}').select(); 
}; 

$(document).ready(function() { 
    myFunc(); 
}); 
</script> 

<h:form id="form"> 
    <h:commandButton action="#{bean.save}" onclick="return myFunc();" ...> 
    <f:ajax execute="@form" render="@form"/> 
    </h:commandButton> 
    ... 
</h:form> 

Questa soluzione funziona, ma è un problema, che <f:ajax> viene chiamato dopo onclick, così la forma è resa dopo selezione dei componenti, e messa a fuoco viene azzerato.

Come posso chiamare la funzione DOPO che il modulo è visualizzato?

aggiornamento: (ho provato, per esempio)

• aggiungere onevent="myFunc();" a f:ajax => porta a rinfrescante pagina
• aggiungere onevent="myFunc()" a f:ajax => stesso comportamento onclick attributo
• prossimo f:ajax con onevent attr. => Sempre lo stesso

Update2 (come dovrebbe opere):

• presentare pulsante è ajax chiamato
• forma è pulita, se necessario
• campo appropriato è focalizzata (dipendeva alcuni utenti scelto fattori)

Answer 1

Il gestore onevent saranno effettivamente inv oked tre volte e dovrebbe puntare a un nome di funzione, non alla funzione stessa. Una volta prima che la richiesta Ajax sia stata inviata, una volta dopo l'arrivo della risposta ajax e una volta quando il DOM HTML viene aggiornato correttamente. Dovresti controllare la proprietà status dell'argomento dati specificato per quello.

function listener(data) { 
    var status = data.status; // Can be "begin", "complete" or "success". 

    switch (status) { 
     case "begin": // Before the ajax request is sent. 
      // ... 
      break; 

     case "complete": // After the ajax response is arrived. 
      // ... 
      break; 

     case "success": // After update of HTML DOM based on ajax response.. 
      // ... 
      break; 
    } 
} 

Nel vostro caso particolare, è quindi solo bisogno di aggiungere un controllo se lo stato è success.

function myFunc(data) { 
    if (data.status == "success") { 
     var element = document.getElementById('form:#{bean.componentId}'); 
     element.focus(); 
     element.select(); 
    } 
} 

ed è necessario fare riferimento alla funzione con il suo nome:

<f:ajax ... onevent="myFunc" />