Zurücksetzen von Eingabetextwerten auf Standardwerte?

Question

Ich habe eine Seite, wo ein a4j: commandbutton die Werte von 2 Textfeldern erfasst. Die Textfelder Werte werden auf diese Weise vorbelegt:

<a4j:region id="pnreg" > 
    <h:inputText id="pn" binding="#{bean.pn}" 
    value="Enter Number..."  
    onclick="clickclear(this, 'Enter Number...')"/>  
    </a4j:region> 
    </td> 
    <td width="20"> 
    <a4j:region id="qtyreg" > 
    <h:inputText value="Enter Part Qty..." id="qty" binding="#{bean.qty}"  
    onclick="clickclear(this, 'Enter Qty...')"/>  
    </a4j:region> 
    </td>  
    <td width="20%"> 
    <a4j:commandButton id="addPart" render="pn,qty" value="Add Part" 
    action="#{bean.submit}" /> 

Wenn die Seite geladen wird die Textfelder zeigen die Standardwerte, und wenn in ihnen Benutzer klickt die Werte gelöscht werden, so codiert. Wenn Sie auf die Schaltfläche klicken, möchte ich, dass die Textfelder auf die Standardwerte zurückgesetzt werden. Mit jquery muss ich einen Click-Event-Handler hinzufügen, aber die richfaces api hat bereits einen Event-Handler an die a4j: commandbutton angehängt. Wie kann ich meinen jquery Eventhandler mit richfaces eventhandler arbeiten lassen? Vielen Dank.

Answer 1

Erstellen Sie eine neue JavaScript-Funktion, die clickclear() in Ihren Textfeldern aufruft. Ändern Sie dann den a4j: commandButton, fügen Sie einen oncomplete = "yourNewFuction();" Attribut, damit Ihre neue Funktion ausgeführt wird, wenn Ihr AJAX-Aufruf abgeschlossen ist.

Answer 2

Wenn Sie die Werte der input setzen zurück wollen, dann sollten Sie Ihre js Funktion in der onclick Methode des a4j:commandButton hinzufügen:

<a4j:commandButton id="addPart" value="Add Part" 
    onclick="alert('Before the ajax submit...');verifyInputTexts();" 
    action="#{bean.submit}" 
    render="pn,qty" limitToList="true" 
    oncomplete="alert('Ajax completed!')" /> 

In diesem Codebeispiel verifyInputTexts könnte Ihre JS-Funktion sein, validiere deinen HTML-Code mit Javascript. Noch eine Sache, die Art und Weise, wie ich die Attribute für die a4j:commandButton geschrieben habe, ist in der Reihenfolge, in der sie ausgeführt werden, die limitToList="true" ist zu sagen, dass der Ajax nur die Komponenten im render Wert erneut rendern sollte.

Answer 3

Setzen Sie die input innerhalb derselben Form wie die Schaltfläche „Abbrechen“ und die Verwendung type = „reset“ ex:

<h:form id="globalNotificationSettingsForm"> 
     your input <h:inputText> 
     <a4j:commandButton id="cancelButton" 
     ....other tags.. 
     render="globalNotificationSettingsForm" 
     immediate="true" 
     type="reset"/> 
</h:form>