add to cart in pop up window .. odd bouncing about

[davidfarndon]

if I include an 'add to cart' button in the extended info pop up, it adds the selected item to the cart .. this is good.

there is a functionality oddity though, as when it adds to cart in the pop up, it briefly displays the basket and bounces back to the original page (not the extended info page) .. in the pop up. So I end up with two versions of the main page showing, one of which is now in the pop up window.

Is there a way that, if the add to cart button is pressed on the normal page it does it's normal thing .. but if the add to cart button is pressed in the extended info pop up it doesn't bounce about. It looks a bit strange .. I've noticed that the main page (which is now sitting behind the pop up window) has not refreshed the cart value to represent the new addition either .. and doesn't unless you add something else or view the basket. How do I get the basket value to refresh correctly whenever something is added to it, from wherever it's aded (from the pop up window or the normal window).

fun though.

[NormanRouxel]

It is not usual for the Extended Info in a popup to be used for anything other than additional product details (some text and a large image only is the usual behaviour).

If you have full product details including add to cart then you should configure the Extended Info to open in the same browser window as the product.

One way (if you're feeling brave) to do this would be to investigate adding

target="_parent"

to the <form ...> tag that adds to cart. You'd also need some onsubmit JavaScript the performs a delayed window.close(); to dismiss the popup. Make sure you test in all browsers.

Alternatively you could try opening the popup page in a Lightbox instead of a simple popup window (the Greybox variant - http://orangoo.com/labs/GreyBox/ - may be a good one to try).

[NormanRouxel]

Opening Extended Info pages in a lightbox - the Thickbox variant.

NB Lightly tested so may need further work.

From http://jquery.com/demo/thickbox/ (scroll down to the Download tab) get the following files and put into your Site folder:

thickbox-compressed.js
ThickBox.css
loadingAnimation.gif
jquery-latest.pack.js - via link "compressed version of jQuery"

Put an additional copy of loadingAnimation.gif in your sites PreviewHTML folder.

Edit thickbox-compressed.js and amend the line:

var tb_pathToImage = "images/loadingAnimation.gif";

to be:

var tb_pathToImage = "loadingAnimation.gif";

In Actinic / Design / Additional Files add file loadingAnimation.gif.


Put the following above </head> in your overall layout(s):-

	<script type="text/javascript" src="jquery-latest.pack.js"></script>
	<script type="text/javascript" src="thickbox-compressed.js"></script>
	<link rel="stylesheet" href="thickbox.css" type="text/css" media="screen" />
	<script type="text/javascript">
		function ShowPopUp(sUrl, nWidth, nHeight){	// redefine Actinic routine to call Thickbox
		tb_show('Product Details', sUrl + '?TB_iframe=true&height=' + nHeight + '&width=' + nWidth + '&modal=false');
		}
	</script>

That's it. Extended Info pages that open in a popup window should now do so in a Thickbox.

It doesn't seem to work in Acinic's internal Preview window but does work on the Page Preview.

If you're using this with Extended Info pages that include an Add to Cart, then edit the line in your Extended Info layout:

      <form method="post" action="<actinic:variable name="OnlineScriptURL" value="Shopping Cart Script URL" />">

to be:

      <form method="post" action="<actinic:variable name="OnlineScriptURL" value="Shopping Cart Script URL" />" target="_parent">

So that the Cart opens in the parent page.

[laulau]

Hi Norman, every time i click in the extended info pop up (more product info button), it adds the selected item to the cart .. how can I remove this functionality??
you can see an example here.

[peblaco]

You have an image source/type on your extended info button. Try using a plain image with a link on instead.

[laulau]

Thanks for replying so fast! its working properly now! Thank you once again...