Click to See Complete Forum and Search --> : How do I implement a confirm box in JSP


pnkflydgr
10-11-2010, 08:07 PM
I hope this is the right place to post this. Didn't see a forum for Java Server Pages. I need to be able to confirm a button before it does it's server side stuff. Here's an example of some HTML I'm working with: <tr>
<td style="padding: 10px;">
<input type="submit" name="operation" value="View Basket">
<input type="submit" name="operation" value="Remove Basket" onClick="checkIt()">
</td>
<td style="padding: 10px;">
<input type="submit" name="operation" value="Add New Basket">
<input type="submit" name="operation" value="Change Selected Basket's Name">
</td>
</tr> As you can see all my buttons are named 'operation'. This is how I run the JSP: if (operation != null)
{
if (operation.equals("View Basket"))
{...
else if (operation.equals("Remove Basket"))
{... and so on. Well the problem is when a user clicks on 'Remove Basket', they need to be able to confirm it. Users are accidentally clicking the button and losing their whole basket of data. Well.....anybody? I need a popup, but everything I read just says it's not possible to integrate JavaScript and JSP. Well ok. Thanks I guess. I've tried putting the JSP in the JavaScript obviously. I also tried doing a window.open work around, but in order to remove the basket I have to have the current selected basket passed to the new window thru a session variable or something, but that's not working either. Sooo frustrating. Is there a simpler solution that I'm missing? PLEASE HELP ME!!!

zimonyi
10-12-2010, 03:19 AM
First off, you can too mix Javascript and JSP, you just need to understand when they are executed.

As with all server-side scripting anything you code that is generated on the server is run on the server. This might sound easy (and in reality it pretty much is) but can sometimes still be confusing.

For your example it is simply the following:

Servlets and JSPs are SERVER-side.
Javascript is CLIENT-side.

When your servlet and JSP pages are run they produce simple HTML code. That means whatever your dynamic code did on the server once the server releases the result it is static HTML code.

In HTML code you can easily add Javascript. This Javascript is not run on the server but on the client (i.e. when your users are actually adding/removing things in their basket).

So if you just add a <SCRIPT> tag in the <HEAD> tag and implement your checkIt() function you should get the result you are asking for.


function checkIt() {
alert('Are you really sure you want to delete your basket?');
}


Instead of the alert you should have one of those Yes/No popups, not sure what that is called off-hand.

Hope it helps,

Archie

pnkflydgr
10-12-2010, 08:26 AM
Thanks for trying zimonyi. I understand the server side / client side concept. What happens when I put the JavaScript in the head is when I click the button a confirm box pops up, but the server side code runs whether you his yes or no. Do you want to remove this basket? No. Too bad it's gone. Anybody else?....

zimonyi
10-12-2010, 08:46 AM
Ok, then I understand.

First off, this question has nothing to do with JSP and everything to do with HTML/Javascript. I would in fact move it to that forum instead.

What happens is that your onclick basically does nothing but pop-up the question and then your form is ALWAYS submitted to the server (where your JSP starts working).

One possible (although perhaps not the best solution) is to do the following:


<input type="button" name="operation" value="Remove Basket" onclick="checkIt()">


Note the change from submit to normal button.

Function checkIt() should look something like:


function checkIt() {
if (confirm('Are you really sure you want to delete your basket?')) {
your_form_variable.submit();
}
}


What that does is calls the confirm window (which I checked up this time) and if true (i.e. the Yes button was pressed) you enter the if-statement and submit your form.

My only concern with this is that I am unsure if the button with the name operation will be the one that sends its value. In fact, if I had done this I would not have four submit buttons, but instead I would simply have four normal buttons and each button calls a local submitForm() function with an argument value which contains what functionality you want to perform, and that sets a hidden input tag with that value.

Hope it helps,

Archie

DROP_TABLE_USER
10-22-2010, 05:14 PM
The client side/server side doesn't really matter to much here. The best choice depends largely on your code. However, should should always client side validation for convenience and server side validation for security. If you want to prompt a user with an alert box in javascript (client side) you can use the functions alert() or confirm(). If you want to spawn an alert box in java you can use JOptionPane in the java.swing libarary

DROP_TABLE_USER
10-22-2010, 05:20 PM
Sorry for the double post I didn't read the entire thread.

If you're application is using JSP's and servlets I would suggest you handle all data requests within java. Javascript can be turned off, is not default in all browsers, and is really just pointless. Your best option would be to send the post data to a servlet and use java's servletrequest interface (getParameters method) to read this information. It sounds like you're using some type of database too. Java jdbc makes databasing extremely easy whereas javascripts "ajax" is fairly cumbersome (albeit "real time").

pnkflydgr
01-10-2011, 01:03 PM
I thought I had reponded to this. My apologies. Turns out the best solution I found was to just put onClick="return checkIt()" in the button. The addition of return actually did what I wanted. So now...when I click the button it says, "Do you want to delete blah?" And when I click no it doesn't delete it. Here is how it looks: <input type="button" name="operation" value="Remove Basket" onclick="return checkIt()">

sohguanh
01-13-2011, 12:25 AM
The more challenging task is the pop-up cannot be "fixed" layout like a alert or confirm dialog. It want to have more buttons, drop-down etc etc in a dialog format.

Above will require much more JavaScript coding to get the desired effect.