Didier's Blog

Question

In ADF Faces, how to submit an input form with the ENTER key ?

Suppose f.ex. the following Login page with 2 input fields: Username and Password, and a button: Login:




Your end users have to enter their username and password and then click the button Login.
However, some would prefer to press the ENTER key as equivalent to clicking Login.

Answer

A lot of developers search for a property in the <af:commandButton> to specify that pressing ENTER should activate the button.
As they don't find any they conclude this is not possible to define it in ADF Faces.
This is true you cannot specify it at the <af:commandButton> level (you can only define an access key there), but you can in the <af:form>.tag.
More details below.

af:commandButton

There is no property in the <af:commandButton> tag to specify that pressing the ENTER key is the equivalent of clicking the commandButton.

There is a property accessKey (sometimes referred to as the "mnemonic") to specify the character that, when pressed in combination with the ALT key, will activate this commandButton.

<af:commandButton text="Login"
id="loginButton"
(...)
accessKey="L" />

In this example, pressing ALT + L will activate the Login button.
The button is rendered with the accessKey underlined as shown the next figure:


NB: you can also use the textAndAccessKey to simultaneously set both the "text" and "accessKey" attributes from a single value, using conventional ampersand (' & ') notation.

af:form

You can specify it in the <af:form> tag. It contains a property defaultCommand where you can specify the id attribute of the command button whose action would be invoked by default for form submit on hitting ENTER on any of the input fields of the form:

<af:form (...) defaultCommand="loginButton" >
(...)
</af:form>

By default, JDeveloper creates a JSF standard h:form tag in your JSF pages, but you can easily convert it to an af:form tag by performing the following steps:

1. in the Structure window, select h:form
   
   
2. select the right-click menu Convert
   
   
   
   
   
3. in the Convert Form dialog, select the category "ADF Faces Core";
   select the item to be created: Form and click OK
   
   
   
   
   
4. select af:form in the Structure window (that's the component we have created);
   in the Property Inspector, type the id of the commandButton in the property DefaultCommand, in this example loginButton
   
   
   
   
   
   

References

JDeveloper online help, topics

• About Default Submit Buttons for Forms
• About Differences Between af:form and h:form
• af:form
  

Oracle Application Development Framework Developer's Guide For Forms/4GL Developers

• 11.4.3 What You May Need to Know About Creating JSF Pages
  
  

Frank explains how to submit a form with the Enter key on his blog.
He works with the standard JSF h:form component and creates JavaScript code to handle the Enter key.

Another solution, that doesn't require Javascript coding, is to use the af:form
It contains a property defaultCommand where you can specify the id
attribute of the command button whose action will be invoked by
default for form submit on hitting ENTER on any of the input fields of
the form.

See the detailed explanation [Here]