Variables undefined in IE works fine FF
The script runs fine in firefox. In internet explorer when the loop runs for the first time, it sets the variables properly but the following times through the loop, my productId and variantId variables are undefined.
Any ideas whats going on here? Pulling my hair out.
- $(document).ready(function() {
var size = [];
var productId = [];
var variantId = [];
$('#outfitMainImage').append('<img id="outfitMainImage1" src="images/outfits/outfit'+outfitId+'/0.jpg" />');
$('#viewFullOutfit').click(function() {
$('#outfitMainImage1').remove();
$('#outfitMainImage').append('<img id="outfitMainImage1" src="images/outfits/outfit'+outfitId+'/0.jpg" />');
});
$(productURLs).each(function(j) {
$('#outfitTopDesc'+j).load(""+productURLs[j]+" #productTitle, #productDescription, #productPrice,#productAddToCart", function(){
//var actionVar = $("#productAddToCart form").attr("action");
productId[j] = $("#outfitItem"+j+" #ProductID").val();
variantId[j] = $("#outfitItem"+j+" #VariantID").val();
alert(productId[j]);
$('#outfitSmallImage'+j).append('<img src="/images/Product/icon/'+productId[j]+'.jpg" width="75px" height="75px" />');
$('#outfitSmallImage'+j).click(
function() {
$('#outfitMainImage1').remove();
$('#outfitMainImage').append('<img id="outfitMainImage1" src="/images/product/medium/'+productId[j]+'.jpg" />');
}
);
$('#productAddToCartButton'+j).append('<input name="Submit" type="button" value="Add To Cart" />').click(function() {
size[j] = $('#outfitItem'+j+' select#Size').val();
if(size[j] == '-,-')
alert("A Size Must Be Selected");
else
$(location).attr('href','addtocart.aspx?ProductID='+productId[j]+'&VariantID='+variantId+'&ReturnURL=t-Outfit-Of-The-Week.aspx&Size='+size[j]);
});
$('#productViewProduct'+j).append('<a href="'+productURLs[j]+'">View Product Page</a>');
});
});
});
Thanks
Justin