jeudi 4 juin 2015

how should I implement if varA not selected display not selected

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