Shopping Cart Theory - Update cart VS Checkout

[gregerly]

Hello,

I once again turn to this community of genius' for some help with a problem. I've got a shopping cart (which is working well so far) that I will be implementing all kinds of AJAX functionality on. However, first I want to make sure it works if javascript is not available. So when your on the shopping cart page, you can update the quantities then click Update Cart, which would update the totals, and refresh the shopping cart page, and then you could checkout. My question is: Without Javascript, how do I know if the user is trying to update the cart, or checkout? The cart in question can be found at:

Fresno SCORE

You have to add a workshop to the cart. Then you will see the cart page I'm talking about.

Thanks in advance!

Greg

[kovik]

I haven't visited the site, but so you know, whenever you do anything in JavaScript, the non-JavaScript alternative needs to make sense. With AJAX, you can automatically update things behind the scenes. Otherwise, just have them post the data through a form and handle it server-side just like you would with AJAX.

[gregerly]

I haven't visited the site, but so you know, whenever you do anything in JavaScript, the non-JavaScript alternative needs to make sense. With AJAX, you can automatically update things behind the scenes. Otherwise, just have them post the data through a form and handle it server-side just like you would with AJAX.

That is what my question is concerning. I know how to use AJAX responsibly, which is why I'm building it to work without Javascript first. But I have one form, with two buttons, UPDATE and CHECKOUT. How do I know that the user wants to UPDATE the cart rather than CHECKOUT and vice versa, when all the code is done on the server side?

Thanks,

Greg

[kovik]

That is what my question is concerning. I know how to use AJAX responsibly, which is why I'm building it to work without Javascript first. But I have one form, with two buttons, UPDATE and CHECKOUT. How do I know that the user wants to UPDATE the cart rather than CHECKOUT and vice versa, when all the code is done on the server side?

Thanks,

Greg

You check for the button upon submission. If you give the button a name attribute, then it will be submitted just like other elements of your form. Be aware that the form can be submitted without clicking a button, so make it so the first button in your form is the default if no button is sent.

[gregerly]

I think I see where you are going with that volectricity. Does that mean that if I have two buttons in the form, say:

[HTML]<button name='update'>Update Cart</button>
<button name='checkout'>Checkout</button>[/HTML]

and I only click the "update" button, the checkout button is not submitted as part of the $_POST array? That will make things easy if this is the case. I'll try it and update here.

Thanks for the response!

Greg

[kovik]

I think I see where you are going with that volectricity. Does that mean that if I have two buttons in the form, say:

[HTML]<button name='update'>Update Cart</button>
<button name='checkout'>Checkout</button>[/HTML]

and I only click the "update" button, the checkout button is not submitted as part of the $_POST array? That will make things easy if this is the case. I'll try it and update here.

Thanks for the response!

Greg

In order to test it, you could simply print out the $_POST array and see what you get.

print_r($_POST);

[gregerly]

Ok, figured it out. Only the button clicked is submitted with the form. I guess you learn something new everyday! Thanks for you help.

We can consider this case closed!

Greg

[pbmods]

Heya, Greg.

Glad to hear you got it working! Good luck with your project, and if you ever need anything, post back anytime :)

[gregerly]

Time to reopen the case.

Issue:

In Firefox, IE7, a button is only is only included with the POST array if it's clicked. So, if you have two buttons on a form, only the one that was clicked will be submitted with the form.

In IE6, all buttons are included in the POST array regardless of if it was clicked or not. So, If I have a form (shopping cart) and I want to give the user the ability to update or checkout, I can't tell what he's trying to do as both buttons are submitted regardless of which one was clicked.

So, how can I tell what the user is trying to do? I'm thinking I'm going to have to use javascript.

[jayturley]

Time to reopen the case.

Issue:

In Firefox, IE7, a button is only is only included with the POST array if it's clicked. So, if you have two buttons on a form, only the one that was clicked will be submitted with the form.

In IE6, all buttons are included in the POST array regardless of if it was clicked or not. So, If I have a form (shopping cart) and I want to give the user the ability to update or checkout, I can't tell what he's trying to do as both buttons are submitted regardless of which one was clicked.

So, how can I tell what the user is trying to do? I'm thinking I'm going to have to use javascript.

I have successfully implemented a solution to this problem by having two submit buttons:

<input type="submit" name="update cart" id="update cart" value="update cart" />
<input type="submit" name="checkout" id="checkout" value="checkout" />
 

When the form is submitted, use the server-side code to determine the value of the submit element of the POST array. Then you can determine what to do from there.

When you Ajaxify, you will use degradable javascript to add return false; to the onclick event handler for the submit buttons to stop the form from submitting, and since you have access to the id of the element clicked, you can submit to whatever page you desire.

Hope this helps,

-Jay

[gregerly]

I have successfully implemented a solution to this problem by having two submit buttons:

<input type="submit" name="update cart" id="update cart" value="update cart" />
<input type="submit" name="checkout" id="checkout" value="checkout" />
 

When the form is submitted, use the server-side code to determine the value of the submit element of the POST array. Then you can determine what to do from there.

When you Ajaxify, you will use degradable javascript to add return false; to the onclick event handler for the submit buttons to stop the form from submitting, and since you have access to the id of the element clicked, you can submit to whatever page you desire.

Hope this helps,

-Jay

Hey Jay!

Thanks for the response. I switched over to the input type=submit and now things look like they are working great!

Nice work.

Greg

[pbmods]

Heya, Greg.

Glad to hear you got it working! Good luck with your project, and if you ever need anything, post back anytime :)

[gregerly]

Heya, Greg.

Glad to hear you got it working! Good luck with your project, and if you ever need anything, post back anytime :)

Ok, I'm really starting to think pbmods just has that phrase in his clipboard ready to paste into any thread. :) Seriously....do you?

Greg

[kovik]

Ok, I'm really starting to think pbmods just has that phrase in his clipboard ready to paste into any thread. :) Seriously....do you?

Greg

*Starting* to think? :P

[pbmods]

Heya, Greg.

Ok, I'm really starting to think pbmods just has that phrase in his clipboard ready to paste into any thread. :) Seriously....do you?

Greg

That doesn't mean that I don't mean it :)

Now good luck with your project! *shove*

[gregerly]

Heya, Greg.

That doesn't mean that I don't mean it :)

Now good luck with your project! *shove*

I know, with the amount of people the experts help here, It's probably a smart thing to do. Thanks to everyone who helps out around here!

Greg