• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Tim Cooke
  • Campbell Ritchie
  • paul wheaton
  • Ron McLeod
  • Devaka Cooray
Sheriffs:
  • Jeanne Boyarsky
  • Liutauras Vilda
  • Paul Clapham
Saloon Keepers:
  • Tim Holloway
  • Carey Brown
  • Piet Souris
Bartenders:

Controlling Enter Key-Triggered Submit Behavior

 
Greenhorn
Posts: 16
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I'm sure a lot of people have asked this, but here is the problem I'm having, and I'm not sure exactly how to solve it. It's probably something simple that I'm just missing conceptually, but hopefully you guys know the answer...

OK... I have a form, and in the form I have two commandButton components. One is "Back" and has its immediate attribute set to "true". The other button is "Continue", and its action attribute is set to call a method on a bean. Both work great if the user *clicks* on the respective buttons.

However, the problem is that if the user hits the *Enter* key, the form submits (expected), but it behaves as if the "Back" button was clicked. Is there a way to force the submit of a form to always do the same action of the "Continue" button (i.e. call the method on the bean)?


thanks!

///eks
 
Ranch Hand
Posts: 572
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
i think you will have to specify id="submit" for that button
 
Greenhorn
Posts: 28
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
If you can use JavaScript, then trap the enter key event and submit the form to the action that would be called on clicking the "Continue" button.
 
Ranch Hand
Posts: 2458
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Put the submit button in the front of the button group. By default HTML spec always the firstnext button will be used.
 
evan k. stone
Greenhorn
Posts: 16
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Thank you for the suggestions. Unfortunately I can't do Bauke's suggestion since the design is rather specific in its placement of the buttons.

I tried out ali's suggestion, and it seems to not work as expected. I made the continue button's id "submit", but it still triggers the "Back" commandButton.

So it looks like I'm down to trying Anu's suggestion, or some variant of it. Let me know if anyone has any other suggestions.

[EDIT]
Anyone have any good resources (links, etc.) for doing the kind of thing Anu is suggesting? I haven't "taken the plunge" yet with embedding JavaScript into my JSF pages yet (other than what gets automatically generated) - is that a really daunting task or is it fairly straightforward?
[/EDIT]

Thanks again!

///eks
[ December 20, 2006: Message edited by: evan k. stone ]
 
Bauke Scholtz
Ranch Hand
Posts: 2458
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Try putting the back button in a separate h:form.
 
Ali Gohar
Ranch Hand
Posts: 572
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
As far as javascript is concerned you can do something like this



Here i have used "onklick" instead of "onclick" because it is not allowing me to use that one. so just replace it

Now write the javascript function



If you are using the controls inside a <h:form> tag then you will have to append the form id with the control name to form that. For example if your form name is myForm then you will write the if condition in javascript as

same for the other control
 
reply
    Bookmark Topic Watch Topic
  • New Topic