I have a simple product page with a few sizes and an add to cart button. I want to use jquery to $("").toggle(); a message saying "choose a size" if a size isn't selected onClick of the Add to Cart button. here is my code.
ryan.js
function ryanClicked(id, b, c){
b = b || null;
c = c || null;
document.getElementById(id).style.borderColor = "black";
document.getElementById(b).style.borderColor = "#e0e0e0";
document.getElementById(c).style.borderColor = "#e0e0e0";
}
html.html
<div class="pp">
<div id ="sizeButton1"class="sizeButton" onclick="ryanClicked('sizeButton1','sizeButton2','sizeButton3')"> S </div>
<div id ="sizeButton2"class="sizeButton" onclick="ryanClicked('sizeButton2','sizeButton1','sizeButton3')"> M </div>
<div id ="sizeButton3"class="sizeButton" onclick="ryanClicked('sizeButton3','sizeButton1','sizeButton2')"> L </div>
</div> <br>
//I want to prevent the onClick from happening if size is not selected
<p class="ryanAddButton" onclick="simpleCart.add('quantity=1','name=Black Gold','price=58','image=images/thumbs/blackGold.jpg');return false;" >Add to Cart</p>
<p class ="hiddenTilClicked"> You must select a size! </p>
I want the onclick to be called when a size is selected and I want a jquery toggle to be callled if a size is not selected. What's a way I can do this? I can just use js if statement but I don't know how to use JS to display html.
Aucun commentaire:
Enregistrer un commentaire