0

I have a form with several buttons and a link that says "Delete user data". Upon click on the link, a confirmation popup shows before any action takes place. Here is the code for this:

<p:confirmDialog closable="false"
    header="#{bundle['remove.user.data']}"
    message="#{bundle['remove.user.data.text']}"
    severity="alert" widgetVar="deleteUserPopup">
    <h:commandButton
        actionListener="#{userBean.deleteUserData}"
        value="#{bundle['yes']}" immediate="true"
        onclick="deleteUserPopup.hide()">
            <f:attribute name="userId"
                value="#{userBean.user.id}" />
            <f:ajax execute="@this" render="@all" />
    </h:commandButton>      
    <h:commandButton value="#{bundle['no']}"
        onclick="deleteUserPopup.hide()" type="button" />
</p:confirmDialog>

<div>
    <h:commandLink>
        <h:outputText value="#{bundle['remove.user']}" />
        <h:graphicImage name="remove.png" library="img"
            title="#{bundle['remove.user']}" />
        <f:ajax event="click"
            onevent="deleteUserPopup.show()" />
    </h:commandLink>
</div>

In the form, I have a lot of fields, but it's the text fields that are problematic, because when a user enters text in it and hits on Enter, the method deleteUserData is called immediately (without confirmation popup). Here is the code of one two fields for example:

<div>
    <h:panelGrid columns="2">
        <h:column>
            <h:inputText
                value="#{userBean.user.lastName}" id="userLastName" />
            <h:message for="userLastName" styleClass="warning" />
        </h:column>
        <h:column>
            <h:inputText
                value="#{userBean.user.firstName}" id="userFirstName" />
                <h:message for="userFirstName" styleClass="warning" />
        </h:column>
    </h:panelGrid>
</div>

All of the above code (2 divs and a confirm dialog) comes inside of a <h:form> So, I don't get it, why on Enter the action listener of the command button is executed?

Bubolina
  • 141
  • 2
  • 16

1 Answers1

1

This is normal HTML behavior, general, the firstnext input type="submit" relative to the current input element will be invoked on enter press. Full answer on this page: Default action to execute when pressing enter in a form

Community
  • 1
  • 1
sQer
  • 1,136
  • 8
  • 9
  • Hello and thanks for your suggestion. Unfortunately, none of the suggested solutions worked out - neither the JS capture of the enter key, nor swapping the buttons in HTML, nor even adding a new first button with visibility:hidden. I think the problem here is not that a firstnext input is being submitted, but another one.Can you suggest another workaround? – Bubolina Oct 10 '14 at 12:47
  • 1
    Did you try this ? You can use the p:defaultCommand with id to your Button to define what happens when the Enter key is pressed – sQer Oct 10 '14 at 12:55
  • Maybe simple workaround : – sQer Oct 10 '14 at 13:19
  • and also some page with example for rich faces http://achorniy.wordpress.com/2010/11/06/disable-enter-form-submit-fix-inputnumberspinner/ – sQer Oct 10 '14 at 13:20