Skip to main content

Este es el código, quiero que al clickear en ¿Quieres reservar? se muestre el div "calendario_reserva", pero algo falla:

HTML:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">
<label>¿Quieres reservar?</label>

<div class="" id="calendario_reserva">
AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
</div>

<br/>
<button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

JS:

activar_reserva();

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="activar_reserva();">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>
activar_reserva();

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}
 

https://jsfiddle.net/ogdbt09v/

Este es el código, quiero que al clickear en ¿Quieres reservar? se muestre el div "calendario_reserva", pero algo falla:

HTML:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">
<label>¿Quieres reservar?</label>

<div class="" id="calendario_reserva">
AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
</div>

<br/>
<button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

JS:

activar_reserva();

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

https://jsfiddle.net/ogdbt09v/

Este es el código, quiero que al clickear en ¿Quieres reservar? se muestre el div "calendario_reserva", pero algo falla:

activar_reserva();

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}
<form action="#" method="post">
  <input type="checkbox" id="activar_reserva" onclick="activar_reserva();">
  <label>¿Quieres reservar?</label>

  <div class="" id="calendario_reserva">
  AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
  </div>

  <br/>
  <button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>
 

https://jsfiddle.net/ogdbt09v/

Origen Enlace

¿Porqué no me funciona onclick?

Este es el código, quiero que al clickear en ¿Quieres reservar? se muestre el div "calendario_reserva", pero algo falla:

HTML:

<input type="checkbox" id="activar_reserva" onclick="activar_reserva();">
<label>¿Quieres reservar?</label>

<div class="" id="calendario_reserva">
AQUI UN CALENDARIO PARA SELECCIONAR LA FECHA.
</div>

<br/>
<button type="submit" name="action" value="contestar" class="form-control fondo2 color1" style="margin-top:10px;">Enviar</button>

</form>

JS:

activar_reserva();

function activar_reserva(){
    if(document.getElementById('activar_reserva').checked){ 
        document.getElementById('calendario_reserva').style.display = "unset"; 
    }else{ 
        document.getElementById('calendario_reserva').style.display = "none"; 
    }
}

https://jsfiddle.net/ogdbt09v/