Radio-button JS if(radioButton.checked)
How to select all the Radio-buttons in the same group(same name attribute), and when checked, they will add certain classes to other elements, when not, they will remove them?
13 Replies
you can use
document.querySelectorAll('input[type="radio"][name="yournamehere"]'); to find all the radio buttons with name yournamehere
Then you can loop over that using forEach and addEventListener('change', () => {...}); to run code whenever the radio button changes valueHere's a very basic (and verbose) example:
https://codepen.io/c__beck/pen/zYaEVpX
@jochemm Let me try that out
Beck's example is probably much better tbh
yeah
I'm beginner so the code itself is hard to read
especially as a beginner, I'd suggest first trying to understand the code in the code pen and asking if anything is unclear
@cvanilla13eck Can I just DM you my problem so I can explain what is troubling me? I have solution, but it is super hard-coded and not dynamic. Or DM @jochemm if beck is busy?
But the code-pen he sent seems like solution
I just need to decipher it
Why work in DMs when you can potentially get answers from both of us by explaining in here? with the added benefit that other people might still show up and help, or someone else might find this later and it helps them too?
Agree. Just did not want to clog it. xD
Forgot it is thread in itself
I think the code-pen he send is the answer. It is just too complicated. I need to first understand it.
If you want to hop in a video call I can walk you through it, @Dovah
That sounds nice! But currently my home is busy and hence noisy, so me talking would be a problem. But we can try!
?
Hope in the private chat room
You'll see me there
sec