Estos scripts son una buena base para reducir la carga de trabajo en el servidor, es muy importante que tengamos en cuenta que debemos validar los datos siempre en el servidor, aunque estos hayan sido validados en el cliente.

Comprobar dos campos iguales

<script>
function validar_contrasena(form) {
if(form.campo_contrasena_2.value == form.campo_contrasena_1.value) {
alert("CORRECTO");
}else{
alert("La contrasena no coincide \n Intentalo de nuevo.");
form.campo_contrasena_2.value = ""; form.campo_contrasena_2.focus();
return true;
}
}
</script>
<form name="formulario_didesweb" method="POST">
<p>contrasena: </p>
<input type="password" name="campo_contrasena_1"><br>
<p>Repetir contrasena: </p>
<input type="password" name="campo_contrasena_2"><br>
<input type="button" value="Registrarse" onClick="validar_contrasena(this.form)">
</form>

Ejemplo

contrasena:

Repetir contrasena:


Ocultar “submit”

<script>
function submit_oculto_n(form) {
if ((form.nombre.value != "") && (form.apellido.value != "")) {
form.enviar.style.visibility = "visible";
}else{
form.enviar.style.visibility = "hidden";
}
}
</script>
<form name="formulario_didesweb2" method="POST" action="">
<p>Nombre: </p>
<input type="text" name="nombre" size="20" onKeyUp="submit_oculto_n(this.form)">
<p>Apellido: </p>
<input type="text" name="apellido" size="20" onKeyUp="submit_oculto_n(this.form)">
<br>
<input type="submit" name="enviar" value="Enviar" style="visibility: hidden">
</form>

Nombre:

Apellido:


Deshabilitar “submit”

<script>
function submit_oculto(form) {
if ((form.nombre3.value != "") && (form.apellido3.value != "")) {
form.enviar3.disabled = false;
}else{
form.enviar3.disabled = true;
}
}
</script>
<form name="formulario_didesweb3" method="POST" action="pagina.htm" target="_blank">
<p>Nombre: </p>
<input type="text" name="nombre3" size="20" onKeyUp="submit_oculto(this.form)">
<p>Apellido: </p>
<input type="text" name="apellido3" size="20" onKeyUp="submit_oculto(this.form)">
<br>
<input type="submit" name="enviar3" value="Enviar" disabled>
</form>

Nombre:

Apellido:


Comprobar campos vacios

<script>
function alerta(campo) {
alert("Por favor, completa el campo "+campo)
}
function validar_formulario(form) {
if (form.nombre4.value == "") {
alerta('\"Nombre\"'); form.nombre4.focus(); return true;
}
if (form.telefono4.value == "") {
alerta('\"Teléfono\"'); form.telefono4.focus(); return true;
}
if (form.direccion4.value == "") {
alerta('\"Direccion\"'); form.direccion4.focus(); return true;
}
form.submit()
}
</script>
<form name="formulario_didesweb4" method="POST">
<p>Completa el formulario</p>
<p>Nombre: </p>
<input type="text" name="nombre4"><br>
<p>Teléfono: </p>
<input type="text" name="telefono4"><br>
<p>Direccion: </p>
<input type="text" name="direccion4"><br>
<input type="button" value="Terminar" onClick="validar_formulario(this.form)">
</form>

Completa el formulario

Nombre:

Teléfono:

Direccion:


Habilitar campos con otros campos

<script>
function bloqDesbloq() {
a = login.usuario.value
if (a != "") {
a = true;
}else{
a = false;
}
if (a == true) {
login.clave.disabled = false;
}else{
login.clave.disabled = true;
}
}
</script>
<form name="login" method="POST" action="">
Usuario: <input type="text" name="usuario" size="10" onKeyUp="bloqDesbloq()"><br>
Clave: <input type="password" name="clave" size="10" disabled>
</form>

Usuario:

Clave:


Borrar texto por defecto

<form name="formulario_didesweb5" method="POST">
<input type="text" name="usuario5" value="Usuario" onClick="formulario_didesweb5.usuario5.value=''">
<br>
<input type="password" name="contrasena5" size="6" value="123456" onClick="formulario_didesweb5.contrasena5.value=''">
</form>


Puedes ver el código de este archivo en mi cuenta de GitHub.

Valoraciones


1 valoración

  • Jeta 3 diciembre, 2020

    exelente

Tu valoración


* Tu valoración puede tardar hasta 72 horas en publicarse.

He leido y acepto el Aviso legal y condiciones de uso

Utilizamos cookies propias necesarias para el correcto funcionamiento de la web y personalizar el contenido. No utilizamos cookies de terceros ni guardamos información personal sobre ti. Puedes encontrar más información en nuestra Política de cookies.

ACEPTAR
Aviso de cookies