Monday Jul 23, 2012

How-to reset ADF Faces inputFile components

When working with the ADF Faces input file component, you'll notice a change in the UI after uploading a file in that the file name is displayed as a label and the upload button text changes to Update.

From a use case perspective this behavior may be fine if you bind the component value property to a managed bean that you want to update with changed file uploads. For generic file upload functionality though you probably prefer the input file to reset its state to the original display: input field and upload button text as "Browse".

To achieve this, you need to explicitly reset the input file component in a call to resetValue() on the RichInputFile component instance.

You can access the RichInputFile component instance from a JSF component binding to a manage bean (sub-optimal) or from a dynamic component lookup (recommended) in the component tree, using the UIViewRoot as a starting point or using Apache MyFaces Trinidad ComponentUtils:

http://myfaces.apache.org/trinidad/trinidad-api/apidocs/org/apache/myfaces/trinidad/util/ ComponentUtils.html

Wednesday Nov 24, 2010

Using JavaScript to clear validation error messages

ADF Faces provides client validation for component constraints like required fields. If input fields fail validation, then form data is not submitted to the server and instead an error message is displayed for the fields causing the error.

The error messages are displayed until the user corrects the input field values and re-submits the form, which could be irritating to users. To get rid of error messages of a failed form submit, application developers can use JavaScript as shown below

<af:resource type="javascript">
function clearMessagesForComponent(evt){
AdfPage.PAGE.clearAllMessages();
evt.cancel();
}
</af:resource>

The JavaScript client function is called from the focus event of a client listener added to the input fields in a form

<af:panelFormLayout id="pfl1">
<af:inputText value="#{bindings.EmployeeId.inputValue}" ...>
...
<af:clientListener method="clearMessagesForComponent"
type="focus"/>
</af:inputText>
<af:inputText value="#{bindings.FirstName.inputValue}" ... >
...
<af:clientListener method="clearMessagesForComponent"
type="focus"/>
</af:inputText>
...
</af:panelFormLayout>

Note: The AdfPage.js class provides APIs to access the component messages and the changed components in list objects to individually handle component error message instead of clearing them all.

About

The Oracle JDeveloper forum ranks in the Top 5 of the most active forums on the Oracle Technology Network (OTN).



The OTN Harvest blog is a summary of selected topics posted on the OTN Oracle JDeveloper forum.



It is an effort to turn knowledge exchange into an interesting read for developers who enjoy little nuggets of wisdom





Frank Nimphius

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today