Cart opening in new window - interesting find

[rattlinggoose]

Step 1: I copied and pasted the add to cart and view to cart code on my page, and everything worked fine.

Step 2: I tried formatting the layout/font/etc of the variants and buttons and put the code into a simple table. After this, the cart would open in a new window when clicking "Add to Cart", but it would still have the fancy window when clicking "View Cart". Strange.

Step 3: I cut and pasted the "Add to Cart" and "View to Cart" code (just the button code, not the variants and such) to someplace OUTSIDE the table. Everything seems to be functioning normally now.



Isn't that strange? I simply moved the button code outside of the table to get the fancy box to pop up, but inside the table, it didn't work. Anyone else experience this?

[rattlinggoose]

UPDATE:



After my last post, both my buttons were outside of the table and functioning properly. As an experiment, I put the button code inside a div tag, and the fancy box STOPPED WORKING AGAIN. What's the deal? It seems like I'm not able to change the layout of the buttons with divs or tables. Does anyone know how I'm supposed to do this?

[elliebags]

I was having the same problem. If the add to cart input button is not a direct child of the form element, the pop up will not work.



In our case, we just wanted the form centered, so we wrapped the entire form element in a centered div. The pop up worked in this case because the add to cart input element was still a direct child of the form element.

[E-junkie_Guru]

This sort of thing often happens in FrontPage and similar WYSIWYG/visual editors, when you paste the button code in raw-code HTML view first and then switch to Visual mode and start moving buttons around visually. As you have discovered, this can yank the menus/buttons outside of the rest of the code we provide that actually makes those menus/buttons work!



It's kind of like taking the volume knob off your car radio and sticking it on your trunklid to control the radio while you're having a tailgate cookout -- it doesn't work because the knob by itself doesn't control the volume, it connects to something inside the radio that controls the volume, and those parts are still inside your dashboard in the car! Likewise, when you move our menus/buttons around in Visual editing mode, it leaves other functional parts of the code behind wherever you last left them in HTML code view, and the menus/buttons don't work by themselves without being "hooked up" to those other parts.



A good approach to deal with this is to start by putting some placeholder text like XXXXX where you want the buttons to appear in Visual mode, move that around and format it however you wish, then once you've got that settled, switch to HTML mode and replace the placeholder XXXXX with our actual, complete button code. ;^)