Here is a much more simplified demo and explanation of what I�m trying to do � and also what else I learned myself last night. Using Firebug helped me at least figure out WHERE the problem is - but I still am stumped as to how to fix it. [I do have it work in IE6 and IE7, but not in FF or Safari]
The ultimate goal is for the user to use the List/Menu to pick a size of a t-shirt that will be displayed via a photo above the List Menu. The javascript code takes the name of the shirt (such as �SEU-�) and appends a size character to the end of it � so that the possible results are SEU-S (for small), SEU-M for medium, SEU-L, and SEU-XL.
You can tell that it works fine if and only if the page you are directed to after hitting �add to cart� tells you that what you just selected has been added to the cart. It is not working fine if it tells you �Sorry � your shopping cart is empty�.
I stripped pretty much everything out of yesterday�s code last night, and placed at the new URL below what I have left that demonstrates the problem:
http://www.missioninland.com/simple_demo.html In IE6 and IE7, everything works fine � no problems (that I know of anyway). The debug popups in the javascript function always pop-up, and the correct current value of the List/Menu is echoed to me. Hitting the �add to cart� button always causes the correct shirt descriptor (SEU-S, SEU-M, SEU-L, or SEU-XL) to be echoed, and passed successfully into the shopping cart.
In Firefox 2.0.0.15 and Safari 3.1.2, it does not work at all � and I�m stumped! [You can see in the
test cases below how the problem surfaces.]
There are just two test cases to know that this works:
Test Case 1 � Accepting List/Menu default = Large size shirt 0) Clear your browser cache; make sure pop-ups are enabled in your browser
1) Call up the page
http://www.missioninland.com/simple_demo.html 2)
You should immediately see (and do see in IE6 and IE7) the first (forced) call to the get_selected_productname1() function cause a pop-up to occur with the default shirt size �SEU-L� to be displayed to you. Hit �Okay� on the pop-up to continue.
3) Do not touch the List/Menu (which means you accept the default size = Large), and only hit the �add to cart� button.
4) a) In IE6 and IE7, what you see next is that the Large Shirt (SEU-L) is correctly added to the shopping cart � and you are redirected to the shopping cart page that shows it actually added. This means success.
4) b) In Firefox and Safari, something goes wrong (see Firebug results below). You never see the pop-up from 2) above, and when you hit the �add to cart� button � it does not successfully pass the form parameters to the cart � which you know because the cart says �Sorry � Your shopping cart is empty�.
Test Case 2 � Changing List/Menu to a different size shirt 5) Clear your browser cache; make sure pop-ups are enabled in your browser
6) Call up the page
http://www.missioninland.com/simple_demo.html 7) You should immediately see (and do see in IE6 and IE7) the first (forced) call to the get_selected_productname1() function cause a pop-up to occur with the default shirt size �SEU-L� to be displayed to you. Hit �Okay� on the pop-up to continue.
8) This time change the value of the List/Menu to something like �Medium�. You immediately notice (in IE6 and IE7) that the pop-up box echoes the new shirt name (SEU-M) � hit okay on the pop-up, then hit the �add to cart� button.
9) a) In IE6 and IE7, what you see next is that the selected shirt (Medium in this case) is correctly added to the shopping cart � and you are redirected to the shopping cart page that shows it actually added. This means success.
9) b) In Firefox and Safari, again something goes wrong (see Firebug results below). You never see either of the pop-ups, and when you hit the �add to cart� button � it does not successfully pass the form parameters to the cart � which you know because the cart says �Sorry � Your shopping cart is empty�.
Debug Results from Firebug So the problem is that everything works fine in IE6 and IE7, but does not work at all in Firefox and Safari. I installed Firebug into Firefox, and the error it gives me is that
Document.form1 has no properties
And it points me to this line of code on line 9.
var x = document.form1.finalsize.selectedIndex;
I�ve been staring at this for a while, and I cannot figure out how to fix this. If you or anyone has any ideas, I would be exceptionally grateful � as I�m completely stumped. Thanks in advance!
Greg