How can I show the "processing" popup on a button click?
Posted: Fri Jul 09, 2010 2:37 pm
I have heavily modified the category list page on our site and added Buy buttons to each item in the list so you can buy things directly from that page. I now have a problem that when the user is scrolled down the page and they click a buy button they don't know that the item was added to the cart because the mini cart is way up at the top of the page.
I've noticed that certain operations in the store cause a square popup form to show on screen momentarily to indicate that the site is working on something. If I can make the buy buttons display that popup while the item is being added to the cart I think it would reduce the confusion for our customers. Even if it showed for a set length of time it would indicate that the site is working - right now they click the buy button more than once because nothing on the screen changes if the minicart isn't visible.
Here are some other alternatives I've thought of (just in case someone has already posted how to do this):
* Somehow detect (maybe with jQuery) the new item added to the minicart div and display a message indicating the item was added or possibly scroll the minicart into view when an item is added. This is what I originally planned to do but I'm having trouble figuring out how to get jQuery to detect when the new item is added.
* Make it so the buy button takes the customer directly to the main cart after adding the item. This is my least favorite option since I don't want to get in the way of a customer adding even more items from the category list.
I already figured out how to make the minicart stick to the top of the browser window and it works ok but it would be a problem if the customer adds enough items to their cart so the minicart is taller than the browser window. They wouldn't have access to items at the bottom of the cart and the Check Out button wouldn't be accessible.
What do you think? Any ideas on how to do this?
I've noticed that certain operations in the store cause a square popup form to show on screen momentarily to indicate that the site is working on something. If I can make the buy buttons display that popup while the item is being added to the cart I think it would reduce the confusion for our customers. Even if it showed for a set length of time it would indicate that the site is working - right now they click the buy button more than once because nothing on the screen changes if the minicart isn't visible.
Here are some other alternatives I've thought of (just in case someone has already posted how to do this):
* Somehow detect (maybe with jQuery) the new item added to the minicart div and display a message indicating the item was added or possibly scroll the minicart into view when an item is added. This is what I originally planned to do but I'm having trouble figuring out how to get jQuery to detect when the new item is added.
* Make it so the buy button takes the customer directly to the main cart after adding the item. This is my least favorite option since I don't want to get in the way of a customer adding even more items from the category list.
I already figured out how to make the minicart stick to the top of the browser window and it works ok but it would be a problem if the customer adds enough items to their cart so the minicart is taller than the browser window. They wouldn't have access to items at the bottom of the cart and the Check Out button wouldn't be accessible.
What do you think? Any ideas on how to do this?