I am making a form where pressing an option from the radio button set activates or not some part of the form
the code is the following
<form>
<section class="dataSoli">
<label for="">Lugar y fecha de la solicitud</label>
<input type="text" placeholder="Lugar" name="lugar">
<input type="text" placeholder="DD/MM/AAAA" name="fecha">
</section>
<section class="genData">
<div class="titulo">
<h2>I. DATOS DE/LA SOLICITANTE</h2>
</div>
<div>
<input type="radio" name="soliBy" id="victimaA" value="a" onclick="activate()">
<label for="victima">Victima</label>
</div>
<div>
<input type="radio" name="soliBy" id="victimaB" value="b" onclick="activate()">
<label for="victima">Victima B</label>
</div>
<div>
<input type="radio" name="soliBy" id="victimaC" value="c" onclick="activate()">
<label for="victima">Servidor publico</label>
</div>
<div>
<input type="radio" name="soliBy" id="victimaD" value="d" onclick="activate()">
<label for="victima">Representante legal</label>
</div>
<section id="parteUno" style="display: none;">
<h1>Contesta B y C</h1>
</section>
<section id="parteDos" style="display: none;">
<h1>Contesta A , B, C</h1>
</section>
</section>
</form>
<script type="text/javascript">
function activate(elemento) {
if (elemento.value == 'a') {
document.getElementById('parteDos').style.display = "block";
document.getElementById('parteOne').style.display = "none";
} else {
if (elemento.value == 'b' || elemento.value == 'c') {
document.getElementById('parteDos').style.display = "block";
document.getElementById('parteOne').style.display = "block";
} else {
document.getElementById('parteDos').style.display = "none";
document.getElementById('parteOne').style.display = "none";
}
}
}
I'm supposed to be activating parts of the form but it doesn't work, in this case I get the following error
I don't know if it also depends on the fact that I have the bootstrap CDN, but I don't think that's the case, it just says that it doesn't process 'value'. Or if there is another simpler way I would like to hear it, I'm just starting to see how js works and I want to learn as much as possible from these errors, thanks
The problem you have when trying to access the value of the radio buttons.
onclick() doesn't pass that "item" parameter you've given to your "activate" function.
Instead you have to access the value of the radio buttons with:
document.getElementsByName('soliBy')
Which returns an array where document.getElementsByName('soliBy')[0] is the first element and from there you can get the value, check if it's checked, etc...
Also beware that you have a little rabbit, there is a div that you sometimes call partOne and others partOne... ;-)