You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@myfaces.apache.org by Neal Haggard <Ne...@sas.com> on 2005/07/25 20:28:06 UTC

Form submission with just a text field?

 
Has anyone played around with doing form submission with just a text field for something like a quick search (so that when they hit enter on the field, the form submits?)  Only way I can see to specify an action this way is to specify a valueChangedListener(), anyone else have any ideas?

Re: Form submission with just a text field?

Posted by Mike Kienenberger <mk...@gmail.com>.
This seems to get asked frequently.

It'd be nice if someone who implemented a working solution would
update the wiki with the process.

This is probably a good place to put it (I documented doing something
similar with pulldown menus here).

http://wiki.apache.org/myfaces/SubmitPageOnValueChange

On 7/25/05, Bruno Aranda <br...@gmail.com> wrote:
> I think that the best approximation to this issue is using some
> javascript and the onkeypress attribute. Something like this:
> 
> 1) Include this javascript in the <head>
> 
> [CODE]
> 
> <script language="javascript">
>     function submitEnter(commandId,e)
> {
>         var keycode;
>         if (window.event) keycode = window.event.keyCode;
>         else if (e) keycode = e.which;
>         else return true;
> 
>         if (keycode == 13)
>         {
>                 document.getElementById(commandId).click();
>                 return false;
>         }
>         else
>         return true;
> }
> </script>
> 
> [/CODE]
> 
> 2) Call the Javascript function from the attribute 'onkeypress' of
> your text field:
> 
> <h:inputField value="Hello" onkeypress="return
> submitEnter('submitLogin',event)"/>
> 
> In the function I pass two parameters, the first one is the id of a
> hidden button (the one which submits the form, and the other is the
> event)
> 
> 3) Include the hidden button, which will submit the form and with the
> id used in the onkeypress event:
> 
> <x:commandButton id="submitLogin" forceId="true"
> action="#{yourBean.whateverAction} style="visibility:hidden;" />
> 
> I just use forceId="true" because I want that the rendered id of the
> button is "submitLogin", without autogenerated prefixes (e.g 'form:',
> etc...).
> 
> Hope this helps,
> 
> Bruno
> 
> 
> 2005/7/25, Neal Haggard <Ne...@sas.com>:
> >
> > Has anyone played around with doing form submission with just a text field for something like a quick search (so that when they hit enter on the field, the form submits?)  Only way I can see to specify an action this way is to specify a valueChangedListener(), anyone else have any ideas?
> >
>

Re: Form submission with just a text field?

Posted by Bruno Aranda <br...@gmail.com>.
I think that the best approximation to this issue is using some
javascript and the onkeypress attribute. Something like this:

1) Include this javascript in the <head>

[CODE]

<script language="javascript">
    function submitEnter(commandId,e)
{
	var keycode;
	if (window.event) keycode = window.event.keyCode;
	else if (e) keycode = e.which;
	else return true;
	
	if (keycode == 13)
	{
		document.getElementById(commandId).click();
		return false;
	}
	else
	return true;
}
</script>

[/CODE]

2) Call the Javascript function from the attribute 'onkeypress' of
your text field:

<h:inputField value="Hello" onkeypress="return
submitEnter('submitLogin',event)"/>

In the function I pass two parameters, the first one is the id of a
hidden button (the one which submits the form, and the other is the
event)

3) Include the hidden button, which will submit the form and with the
id used in the onkeypress event:

<x:commandButton id="submitLogin" forceId="true"
action="#{yourBean.whateverAction} style="visibility:hidden;" />

I just use forceId="true" because I want that the rendered id of the
button is "submitLogin", without autogenerated prefixes (e.g 'form:',
etc...).

Hope this helps,

Bruno


2005/7/25, Neal Haggard <Ne...@sas.com>:
> 
> Has anyone played around with doing form submission with just a text field for something like a quick search (so that when they hit enter on the field, the form submits?)  Only way I can see to specify an action this way is to specify a valueChangedListener(), anyone else have any ideas?
>