Primefaces commandButton submitting on enter

5
votes

I have two commandButtons and when I hit enter the first one submits. I really only want to submit the second button if the user hits enter. Any ideas?

2
jsf-2primefaces
If it is possible, you could change the type of the first button to type="button" or make it an ajax button (p:commandButton is by default an ajax button) - Matt Handy

2 Answers

7
votes

I realize that the question is old, but maybe it is still interessing for someone to see a different solution.

You can use the Primefaces defaultCommand and adding an id to your prefered Button to define what happens when the Enter key is pressed. That's all.

<p:commandButton value="button1" action="#{bean.action1}"/>
<p:commandButton value="button2" id="btn_to_enter" action="#{bean.action2}"/>
<p:defaultCommand target="btn_to_enter" />
1
votes

You have to swap the position of those two buttons thats all.

Your current code should be.

<p:commandButton value="button1" action="#{bean.action1}"/>
<p:commandButton value="button2" action="#{bean.action2}"/>

By default the button1 action will be triggered. You can present the user an alternative view, by adding style="float:right" to the button1.

<p:commandButton value="button1" style="float: right" action="#{bean.action2}"/>
<p:commandButton value="button2" action="#{bean.action1}"/>

Using the above the button1 will appear after the button2, and perform the action of button2, whenever the Enter is pressed.