Potential Primefaces Dialog Enter Submit Bug?
I have the exact same dialog form setup as the primefaces example below. When I put my cursor in the p:inputText on the below primefaces example and hit enter the window is closed automatically. On my example, I've even removed all links/buttons etc and just have a form and an input and it still closes the dialog when hitting enter. Any way around this?
http://www.primefaces.org/showcase/ui/dialogForm.jsf
mycode:
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:dc="http://dc.dreamcatcher.com/facelet-taglib">
<ui:composition template="#{layoutBean.registeredTemplate}">
<ui:define name="content">
<h:form id="dreamModifyFrm">
<p:commandLink onclick="webSearchDlg.show();" value="open"/>
<p:dialog header="#{bundle['dreamSearch.HEADER']}"
widgetVar="webSearchDlg" modal="true" styleClass="dialog dialog2"
draggable="false" resizable="false" showEffect="fade" position="top"
hideEffect="fade">
&l开发者_如何学Pythont;p:inputText id="searchText" value="#{dreamSearchBean.searchText}"/>
</p:dialog>
</h:form>
</ui:define>
</ui:composition>
</html>
My issues was fixed using the below: There is a "feature" in IE where if you have only a single input element inside a form then hitting enter while focus in in the input element causes the form to submit (regardless of whether you even have a submit button). One way to prevent this is to add a second input element with style="display: none;".
Add the following onkeyup
attrubute with a little JavaScript to the <h:form>
or the <h:inputText>
element to prevent the default action on enter press.
onkeyup="return event.keyCode != 13"
The enter key has a keycode of 13, so the above will return false
when it is pressed and so the element's default action will be blocked.
Let me just wrap it up from a 2013 perspective:
When using newer PrimeFaces (3.2+?) versions, you can also use
<p:defaultCommand target="search-button" />
as described here:
http://blog.primefaces.org/?p=1787
ShowCase link:
http://www.primefaces.org/showcase-labs/ui/defaultCommand.jsf
Of course, this tag must be directly underneath the h:form tag, otherwise the tag isn't working.
When not using PrimeFaces, you must have something like
<h:inputText style="display: none;" />
on the form, as described in the earlier answer by c12.
Both of the above will cause IE browsers to behave like FF, Chrome, etc. When not using IE at all, BalusC's solution suffices.
I got the same Problem. I have a From with several Dozens InputTexts and several Buttons. When i pressed 'enter' in a inputText, the first Button was triggered and NOT the submit Button.
The hints above (onkeyup="return event.keyCode != 13"
and p:commandButton
with display:none
) didn't work for me.
My solution was pretty simple and works. Just let your Submit-Button be the first button in your HTML-Code. The correct layout/arrangement of Button can be done via CSS, i.e. "float: left;"
Example:
<p:commandButton value="Save" ajax="true"
icon="ui-icon-disk"
update="myTable"
actionListener="#{myTableBean.save()}" />
<p:commandButton id="previousPeriod" update="myTable"
icon="ui-icon-triangle-1-w" ajax="true" type="push"
style="float: left;"
actionListener="#{myTableBean.scrollPrevious}"
value="Previous" />
After putting my Save-Button before my "Previous"-Button, everything worked fine! After pushing "enter" within a inputText, the Form gets submitted now and the "float:left"
places the Prev-Button before the Save-Button in the visual Layout.
精彩评论