JSP: Confirm before submit

Question

I'm trying to show a confirm dialog before submitting form data. I want a dialog to pop up with ok and cancel where ok submits the data and cancel does nothing. This has proven to be trickier than I ever could have imagined.

The web application is in java and jsp. I've tried the following using "onclick=" hoping for a simple solution to no avail:

Java: ReceiveAction.java

        public Resolution receiveInventory() {
             ...
             return new ForwardResolution(ADJUSTMENT);
        }

jsp: receive-action.jsp

        <button name="_eventName" value="receiveInventory" type="submit" class="btn btn-green disabler-ignore-readonly" onclick="javascript:return confirm('are you sure?');">Receive</button>

The problem is I can get the confirm dialog to appear with the above code but receiveInventory is triggered whether I hit ok or cancel. I need it to only trigger when I hit ok. I feel like I'm very well versed in java and jsp but I'm less than a novice when it comes to javascript(I avoid it like the plague) and I think that's what I'm going to need to pull this off. Any help or pointing in the right direction would be greatly appreciated.

Your action should be in the `
` submit event, not in the button. Check this post here: https://stackoverflow.com/questions/6515502/javascript-form-submit-confirm-or-cancel-submission-dialog-box — Bruno Monteiro, May 29 '19 at 20:59
I tried it that way but run into the same problem where the form data is submitted regardless of whether I click ok or cancel. — sleffew, May 30 '19 at 18:02

kht · Answer 1 · 2019-05-30T23:59:52.097

0

Your button is a "submit" type so it is most likely triggering the form's onSubmit event when it is clicked, regardless of your own click handler. Also, confirm returns a boolean which you can use to tell if they selected the "Ok" button.

function checkSubmission() {
    let confirmed = confirm("Are you sure?");

    if (confirmed) {
         // Submit your form....
         recieveInventory(); // document.getElementById('myFormId').submit();
    } else {
        // Handle cancel here if needed
    }
}

<button name="_eventName" value="receiveInventory" type="button" class="btn btn-green disabler-ignore-readonly" onclick="javascript:return checkSubmission();">Receive</button>

Ideally you probably should just set your form's submit handler to call checkSubmission. Then you don't have to set a click handler on the button at all

edited May 30 '19 at 23:59

answered May 29 '19 at 21:06

kht

580
2
8

I was thinking of something along these lines. However, I'm not sure how to call my receiveInventory() method from my ReceiveAction.class on the server yet. – sleffew May 30 '19 at 18:08
Instead of calling receiveInventory() on the client side you can make an API call to your server if the user confirms. The server uses the Java classes you defined to process the request, and sends the result back to the client to use. – kht May 30 '19 at 23:55
If your form is ALREADY submitting your request to the server properly (just need to wait for confirmation) then the quick and dirty way is to change `receiveInventory();` to `document.getElementById('myFormId').submit();` where 'myFormId' is an id you give to the form you are submitting – kht May 30 '19 at 23:58

JSP: Confirm before submit

1 Answers1