need help with drop down refresh problem
Here's the problem - use this page for example -
http://www.petcratesdirect.com/dog-crates-icrates.html
note that when you first visit the page the drop down box list is showing the heading of "available model-size options". Choose an option from the list and click the add to cart button. This will take you away from the page to display your cart contents. If you click the browser back button or my continue shopping link to return to the product page, it displays the page with the drop down list sitting on the product that you just added to the cart. It needs to refresh to the default of "available model-size options".
It wouldn't be a problem if the whole enchilada showed the info for the item that was just added but the price/model/add to cart button reflects the product that I have set as the default when the page loads (the smallest size) so that the if you clicked the add to cart button again, you might think you are adding another of the same item that you just added (since the drop down list is sitting there) when in fact you have added the smallest size to the cart.
I'm using this one simple function that I am calling as icrate1500.js from the html page (see below). Right click to view source to see the implementation in the html file.
Shouldn't there be a simple way to have the back button cause the page to refresh? I'd like to accomplish this with the script as opposed to using meta refresh or the like.
I don't know much about jquery or javascript. Just found this when looking for a "change text based on drop down box selection" for use on the website. It was easy to implement and works great until I went live and realized the issue caused by going back with the browser button.
Any help greatly appreciated. Possible free dog crate
$(function(){
$("#item_id").change(function () {
$("#1518").hide();
$("#1522").hide();
$("#1524").hide();
$("#1530").hide();
$("#1536").hide();
$("#1542").hide();
$("#1548").hide();
var val = $(this).val();
switch(parseInt(val)){
case 1:
$("#1518").show();
break;
case 2:
$("#1522").show();
break;
case 3:
$("#1524").show();
break;
case 4:
$("#1530").show();
break;
case 5:
$("#1536").show();
break;
case 6:
$("#1542").show();
break;
case 7:
$("#1548").show();
break;
}
});
});