KPC
Kevin Powell - Community•13mo ago
Stan Long

Need help with button click output

Hey, can anyone help me with this big issue I'm having right now. I'm trying to have an alert be printed out if one set of buttons are clicked, and a different type of alert be printed out if a different sets of buttons are clicked. It's for a pool business website, and I'm trying to print out a different price based on the buttons the user clicks. I tried if else statement, but it gets stuck on the first if statement, and doesn't switch if another if else statement is true
3 Replies
Stan Long
Stan LongOP•13mo ago
Here's an example of the code I'm having issues with if ((residentialButton.classList = 'active-pool-type') && (xSmallButton.classList = 'active-pool-size') && (chemicalButton.classList = 'active-pool-services')) { alert('hello') } else if ((residentialButton.classList = 'active-pool-type') && (xSmallButton.classList = 'active-pool-size') && (standardButton.classList = 'active-pool-services')) { alert('hi') } The code stops at the first condition, but I need it to run through the variables to check which button has a class name of active class on it, and run a different alert based on what they click
MarkBoots
MarkBoots•13mo ago
a single = sign does not compare, it assigns. (to compare you need to have double or triples ='s) so thats why it get only to the first if. but, you also want to check if classlist.CONTAINS a certain class. (classlist is a list, not a single value). Without able to test your code, I think this will do 
if (
  residentialButton.classList.contains('active-pool-type') && 
  xSmallButton.classList.contains('active-pool-size') && 
  chemicalButton.classList.contains('active-pool-services')) {
    alert('hello');
} else if (
  residentialButton.classList.contains('active-pool-type') && 
  xSmallButton.classList.contains('active-pool-size') && 
  standardButton.classList.contains('active-pool-services')) {
    alert('hi');
}
if (
  residentialButton.classList.contains('active-pool-type') && 
  xSmallButton.classList.contains('active-pool-size') && 
  chemicalButton.classList.contains('active-pool-services')) {
    alert('hello');
} else if (
  residentialButton.classList.contains('active-pool-type') && 
  xSmallButton.classList.contains('active-pool-size') && 
  standardButton.classList.contains('active-pool-services')) {
    alert('hi');
}
i now see your if and else if have exactly the same first 2 conditions. you could simplify it a bit by doing 
if (
  residentialButton.classList.contains('active-pool-type') && 
  xSmallButton.classList.contains('active-pool-size')) {
  if(chemicalButton.classList.contains('active-pool-services')) {
    alert('hello');
  } else if (standardButton.classList.contains('active-pool-services')) {
    alert('hi');
  }
}
if (
  residentialButton.classList.contains('active-pool-type') && 
  xSmallButton.classList.contains('active-pool-size')) {
  if(chemicalButton.classList.contains('active-pool-services')) {
    alert('hello');
  } else if (standardButton.classList.contains('active-pool-services')) {
    alert('hi');
  }
}
probably there is even an easier way to check what set of btns is clicked, but for that we need more context (more of your code)
Stan Long
Stan LongOP•13mo ago
Thank you so much @MarkBoots that fixed my issue, I completely forgot that '=' assigns not compares, no joke I've been at this issue for a full 6 hours, trying to figure out if I can do a workaround

Did you find this page helpful?