0
138
ViewsHow can I edit checkout page with javascript?
I am trying to make the checkout page a change fields when a radio button is selected. So I have 2 options on the radio buttons option A and B When A is selected I want 2 fields below to remain available and other 2 to disappear. The other way around when the second radio button is checked.
I mostly used Wordpress for this website but I need a bit of code for this functionality.
function yesnoCheck('radio-5984531736') {
if (this.radio-5984531736 == "Persoana fizica") {
alert("check");
document.getElementByClassName("juridica").style.display = "block";
} else {
document.getElementByClassName("fizica").style.display = "none";
}
}
I have this code as script in the header. I am not sure if it is not correct or I don t have a code to call this function. The Id and class names are the following:
Radio buttons id : radio-5984531736 Info that should show when A selected class name : fizica Info that should show when A selected class name : juridical
1 answers
Answer question0
I've made a demo similar to your task:
function yesnoCheck() {
var value = document.querySelector("[name='radio-5984531736']:checked").value;
if (value === "v1") {
document.querySelector(".fizica").style.display = "block";
document.querySelector(".juridica").style.display = "none";
} else {
document.querySelector(".fizica").style.display = "none";
document.querySelector(".juridica").style.display = "block";
}
}
var form = document.querySelector("#formId");
form.addEventListener("change", yesnoCheck);<div>
<form id="formId">
<div>
<input type="radio" name="radio-5984531736" value="v1" id="v1id">
<label for="v1id">Persona fizica</label>
<input type="radio" name="radio-5984531736" value="v2" id="v2id">
<label for="v2id">Persona juridica</label>
</div>
<div class="fizica">
Prenume
<input name="prenume"><br/> Nume companie
<input name="numecom">
</div>
<div class="juridica">
Nume
<input name="nume"><br/> CUI
<input name="cui">
</form>
</div>Though I think it can be simpler in your case. E.g. try writing this['radio-5984531736'] instead of this.radio-5984531736. Also, you don't need 'radio-5984531736' in function yesnoCheck() { ....