You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by jnl1 <it...@yahoo.com> on 2008/02/22 22:28:01 UTC
enter key form submission (newbie question)
hi all...
i'm trying to submit a form when a user hits enter. i'm new to myfaces,
so i'm probably missing something simple. seems like this is done with
javascript. below is my javascript which I found from this site. my
problem is, how/where do i invoke the javascript ? currently, there's a
commandLink that's submitting the form. I have a few inputText fields and a
few dropdowns on the form.
here's the commandLink:
<af:commandLink text="#{messages['search']}"
action="#{searchStandardsController.allDataStandardsSearch}"
styleClass="lightbutton"/>
here's my 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) {
clickLink(commandId);
return false;
} else
return true;
}
function clickLink(linkId)
{
var fireOnThis = document.getElementById(linkId)
if (document.createEvent)
{
var evObj = document.createEvent('MouseEvents')
evObj.initEvent( 'click', true, false )
fireOnThis.dispatchEvent(evObj)
}
else if (document.createEventObject)
{
fireOnThis.fireEvent('onclick')
}
}
</script>
--
View this message in context: http://www.nabble.com/enter-key-form-submission-%28newbie-question%29-tp15641660p15641660.html
Sent from the MyFaces - Users mailing list archive at Nabble.com.
Re: enter key form submission (newbie question)
Posted by jnl1 <it...@yahoo.com>.
hi....
i found submitOnEvent and it looks like a cleaner solution. I added the
submitOnEvent call to one of the inputText fields but when I hit "enter",
the form is not submitted. below is my page. can someone point me in the
right direction. Just would like the search form to be submitted when
"enter" is pressed...
thanks...really appreciate the support this forum provides!!
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jstl/core"
xmlns:t="http://myfaces.apache.org/tomahawk"
xmlns:s="http://myfaces.apache.org/sandbox"
xmlns:af="http://xmlns.oracle.com/adf/faces">
<ui:composition>
<h:form id="searchStandardsAllDataStandardsSearchForm">
<h:panelGrid columns="1" width="40%">
<af:panelHeader styleClass="searchPanel">
<af:panelForm rows="4" width="40%" styleClass="searchForm">
<af:inputText
id="criteriaName"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.name}"
label="#{messages['name']}:"
required="false"
readOnly="false">
<s:submitOnEvent for="searchButton" />
</af:inputText>
<af:inputText id="criteriaId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.id}"
label="#{messages['id']}:" required="false" readOnly="false">
</af:inputText>
<af:selectOneChoice id="criteriaCategoryId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.categoryId}"
label="#{messages['category.id']}:" required="false" readOnly="false"
unselectedLabel=""
valueChangeListener="#{searchStandardsController.populateSubcategories}"
autoSubmit="true">
<c:if test="${!empty criteriaCategoryIdBackingList}">
<f:selectItems
value="#{criteriaCategoryIdBackingList}" />
</c:if>
</af:selectOneChoice>
<af:selectOneChoice id="criteriaTypeId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.typeId}"
label="#{messages['type.id']}:" required="false" readOnly="false"
unselectedLabel="">
<c:if test="${!empty criteriaTypeIdBackingList}">
<f:selectItems value="#{criteriaTypeIdBackingList}"
/>
</c:if>
</af:selectOneChoice>
<af:selectOneChoice id="criteriaOrganizationId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.organizationId}"
label="#{messages['organization.id']}:" required="false" readOnly="false"
unselectedLabel="">
<c:if test="${!empty
criteriaOrganizationIdBackingList}">
<f:selectItems
value="#{criteriaOrganizationIdBackingList}" />
</c:if>
</af:selectOneChoice>
<af:selectOneChoice id="criteriaGroupId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.groupId}"
label="#{messages['group.id']}:" required="false" readOnly="false"
unselectedLabel="">
<c:if test="${!empty criteriaGroupIdBackingList}">
<f:selectItems value="#{criteriaGroupIdBackingList}"
/>
</c:if>
</af:selectOneChoice>
<af:selectOneChoice id="criteriaSubcategoryId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.subcategoryId}"
label="#{messages['subcategory.id']}:" required="false" readOnly="false"
unselectedLabel="">
<c:if test="${!empty criteriaSubcategoryIdBackingList}">
<f:selectItems
value="#{criteriaSubcategoryIdBackingList}" />
</c:if>
</af:selectOneChoice>
<af:selectOneChoice id="criteriaStatusId"
value="#{searchStandardsAllDataStandardsSearchForm.criteria.statusId}"
label="#{messages['status.id']}:" required="false" readOnly="false"
unselectedLabel="">
<c:if test="${!empty criteriaStatusIdBackingList}">
<f:selectItems
value="#{criteriaStatusIdBackingList}" />
</c:if>
</af:selectOneChoice>
</af:panelForm>
</af:panelHeader>
<af:panelButtonBar styleClass="floatleft">
<af:commandLink
id="searchButton"
text="#{messages['search']}"
action="#{searchStandardsController.allDataStandardsSearch}"
styleClass="lightbutton"/>
</af:panelButtonBar>
</h:panelGrid>
<a:validator/>
</h:form>
</ui:composition>
</html>
jnl1 wrote:
>
> hi all...
>
> i'm trying to submit a form when a user hits enter. i'm new to myfaces,
> so i'm probably missing something simple. seems like this is done with
> javascript. below is my javascript which I found from this site. my
> problem is, how/where do i invoke the javascript ? currently, there's a
> commandLink that's submitting the form. I have a few inputText fields and
> a few dropdowns on the form.
>
> here's the commandLink:
>
> <af:commandLink text="#{messages['search']}"
> action="#{searchStandardsController.allDataStandardsSearch}"
> styleClass="lightbutton"/>
>
> here's my 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) {
> clickLink(commandId);
> return false;
> } else
> return true;
> }
>
> function clickLink(linkId)
> {
> var fireOnThis = document.getElementById(linkId)
> if (document.createEvent)
> {
> var evObj = document.createEvent('MouseEvents')
> evObj.initEvent( 'click', true, false )
> fireOnThis.dispatchEvent(evObj)
> }
> else if (document.createEventObject)
> {
> fireOnThis.fireEvent('onclick')
> }
> }
> </script>
>
--
View this message in context: http://www.nabble.com/enter-key-form-submission-%28newbie-question%29-tp15641660p15648139.html
Sent from the MyFaces - Users mailing list archive at Nabble.com.
Re: enter key form submission (newbie question)
Posted by Gerhard Petracek <ge...@gmail.com>.
hello,
are you using trinidad?
(trinidad provides the possibility of default command components - see [1] -
have a look at defaultCommand)
---
if you would like to use your custom javascript implementation, you have to
attach the keypress event.
e.g.:
function init()
{
if (document.addEventListener)
{
window.addEventListener("keypress", ..., ...);
}
else
{
document.attachEvent("onkeypress", ...);
}
}
within your page:
<body onload="init();">
you have to adjust your existing javascript implementation to use this
mechanism!
regards,
gerhard
[1] http://myfaces.apache.org/trinidad/trinidad-api/tagdoc/tr_form.html
2008/2/22, jnl1 <it...@yahoo.com>:
>
>
> hi all...
>
> i'm trying to submit a form when a user hits enter. i'm new to myfaces,
> so i'm probably missing something simple. seems like this is done with
> javascript. below is my javascript which I found from this site. my
> problem is, how/where do i invoke the javascript ? currently, there's a
> commandLink that's submitting the form. I have a few inputText fields and
> a
> few dropdowns on the form.
>
> here's the commandLink:
>
> <af:commandLink text="#{messages['search']}"
> action="#{searchStandardsController.allDataStandardsSearch}"
> styleClass="lightbutton"/>
>
> here's my 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) {
> clickLink(commandId);
> return false;
> } else
> return true;
> }
>
> function clickLink(linkId)
> {
> var fireOnThis = document.getElementById(linkId)
> if (document.createEvent)
> {
> var evObj = document.createEvent('MouseEvents')
> evObj.initEvent( 'click', true, false )
> fireOnThis.dispatchEvent(evObj)
> }
> else if (document.createEventObject)
> {
> fireOnThis.fireEvent('onclick')
> }
> }
> </script>
>
> --
> View this message in context:
> http://www.nabble.com/enter-key-form-submission-%28newbie-question%29-tp15641660p15641660.html
> Sent from the MyFaces - Users mailing list archive at Nabble.com.
>
>
--
http://www.irian.at
Your JSF powerhouse -
JSF Consulting, Development and
Courses in English and German
Professional Support for Apache MyFaces