How can I show the "processing" popup on a button click?

Store UI, layout, design, look and feel; Discussion on the customer facing pages of your online store. Cascading Style Sheets, Themes, Scriptlets, NVelocity and the components in the ConLib directory.
Post Reply
SteveHiner
Lieutenant (LT)
Lieutenant (LT)
Posts: 58
Joined: Thu Jun 21, 2007 8:27 pm

How can I show the "processing" popup on a button click?

Post by SteveHiner » 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?
Steve

User avatar
igavemybest
Captain (CAPT)
Captain (CAPT)
Posts: 388
Joined: Sun Apr 06, 2008 5:47 pm

Re: How can I show the "processing" popup on a button click?

Post by igavemybest » Thu Jul 22, 2010 11:44 am

Here is something that may help you with any type of modal popup/overlay

http://www.safetekusa.com/Product.aspx? ... egoryId=80

SteveHiner
Lieutenant (LT)
Lieutenant (LT)
Posts: 58
Joined: Thu Jun 21, 2007 8:27 pm

Re: How can I show the "processing" popup on a button click?

Post by SteveHiner » Thu Jul 29, 2010 1:35 am

Thank you for the suggestion but I don't think that alone will solve my problem.

I still fundamentally need to figure out how to tie into the button click properly on the client side. If I can figure out how to run any script at all when a purchase is made then I'll be home free since then I can use jQuery to do whatever I want. Right now my main problem is figuring out how to run anything client side when the button is clicked without interfering with what Able does for the button click.

Any other ideas anyone?
Steve

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Re: How can I show the "processing" popup on a button click?

Post by jmestep » Thu Jul 29, 2010 7:54 am

If the category contents are within an ajax update panel, you can hook in to the trigger and define your control.
<Triggers>
<asp:PostBackTrigger ControlID ="ContinueButton" />
</Triggers>
</ajax:UpdatePanel>
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

Post Reply