Cómo crear una casilla de aceptación en un formulario por HTML y Javascript

Dentro de nuestra serie de vídeos sobre cómo crear casilla de aceptación de los términos y condiciones o la política de privacidad en un formulario web (algo obligatorio por la RGPD), hoy queremos enseñaros a hacerlo por HTML y Javascript.

Cómo crear la casilla.

Os lo explicamos en el vídeo al final del artículo. Pero básicamente es coger un formulario HTML y añadirle una casilla por HTML. Con un enlace a la página que informa sobre lo que queremos aprobar.

El botón de envío lo desactivamos (disabled) por defecto para que no pueda enviar si no es marcando la casilla.

En la casilla, añadimos una función en el evento onclick, lo que hace que se ejecute la función al marcar la casilla.

Dicha función comprobará el estado de la casilla (checked yes o no) e igualará la marca de disabled a lo contrario de dicho estado. Así que:

  • Casilla marcada yes -> Disabled= no
  • Casilla marcada no -> Disabled = yes

La función es:

<script type=”text/javascript”>
function enableSending() {
document.loginform.submit.disabled = !document.loginform.terms.checked;
};
</script>

Como veis es muy sencillo y podéis implementarlo a mano en cualquier web. Lo usaremos en algún otro artículo.