Foros del Web » Programando para Internet » Javascript »

Como modificar una validación en un form dependiendo si el elemento esta habilitado

Estas en el tema de Como modificar una validación en un form dependiendo si el elemento esta habilitado en el foro de Javascript en Foros del Web. Buen día Tengo un código en el que tengo ciertos campos que son obligatorios, el detalle aqui es que algunos de estos campos quiero que ...
  #1 (permalink)  
Antiguo 21/09/2008, 15:22
Avatar de webbeginner  
Fecha de Ingreso: noviembre-2004
Mensajes: 241
Antigüedad: 20 años, 2 meses
Puntos: 2
Como modificar una validación en un form dependiendo si el elemento esta habilitado

Buen día

Tengo un código en el que tengo ciertos campos que son obligatorios, el detalle aqui es que algunos de estos campos quiero que sean obligatorios SOLO EN EL CASO DE QUE NO estén DESHABILITADOS.

Mas a detalle de mi problema

En el siguiente código tengo un campo nombre y un campo edad que deben ser obligatorios solo en el caso de que seleccionen la opción SI del RadioButton GrupoOpciones1. Actualmente tiene una validación que pide llenar los campos NOMBRE y EDAD en todos los casos, cuando se selecciona NO en el RadioButton GrupoOpciones1 se deshabilitan los mencionados campos (NOMBRE y EDAD ) pero el mi validación en JAVASCRIPT me sigue pidiendo llenar esos campos.

Espero haya explicado bien la problematica

Gracias !!

Código:

Código PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<
html>
<
head>
    <
title>Ejemplo de validación de un formulario</title>
    
<
script>

function 
validarEntero(valor){ 
      
//intento convertir a entero. 
     //si era un entero no le afecta, si no lo era lo intenta convertir 
     
valor parseInt(valor

      
//Compruebo si es un valor numérico 
      
if (isNaN(valor)) { 
            
//entonces (no es numero) devuelvo el valor cadena vacia 
            
return "" 
      
}else{ 
            
//En caso contrario (Si era un número) devuelvo el valor 
            
return valor 
      



function 
valida_envia(){
    
//valido el nombre
    
if (document.fvalida.nombre.value.length==0){
        
alert("Tiene que escribir su nombre")
        
document.fvalida.nombre.focus()
        return 
0;
    }
    
    
//valido la edad. tiene que ser entero mayor que 18
    
edad document.fvalida.edad.value
    edad 
validarEntero(edad)
    
document.fvalida.edad.value=edad
    
if (edad==""){
        
alert("Tiene que introducir un número entero en su edad.")
        
document.fvalida.edad.focus()
        return 
0;
    }else{
        if (
edad<18){
            
alert("Debe ser mayor de 18 años.")
            
document.fvalida.edad.focus()
            return 
0;
        }
    }
    
    
//valido el interés
    
if (document.fvalida.interes.selectedIndex==0){
        
alert("Debe seleccionar un motivo de su contacto.")
        
document.fvalida.interes.focus()
        return 
0;
    }
    
    
//el formulario se envia
    
alert("Muchas gracias por enviar el formulario");
    
document.fvalida.submit();
}
</script>
</head>

<body>

<form name="fvalida">
<table>
<tr>
  <td>¿Tiene Registro?</td>
  <td><p>
    <label>
      <input type="radio" name="GrupoOpciones1" value="Si" id="GrupoOpciones1_0" onClick="document.getElementById('nombre').disabled=false;document.getElementById('edad').disabled=false;"/>
      Si</label>
    <br>
    <label>
      <input type="radio" name="GrupoOpciones1" value="No" id="GrupoOpciones1_1" onClick="document.getElementById('nombre').disabled=true;document.getElementById('edad').disabled=true;"/>
      No</label>
    <br>
  </p></td>
</tr>
<tr>

    <td>Nombre: </td>
    <td><input type="text" name="nombre" size="30" maxlength="100" id= "nombre" ></td>
</tr>
<tr>
    <td>Edad: </td>
    <td><input type="text" name="edad" size="3" maxlength="2" id="edad" ></td>
</tr>
<tr>
    <td>Interés:</td>

    <td>
    <select name=interes>
    <option value="Elegir">Elegir
    <option value="Comercial">Contacto comercial
    <option value="Clientes">Atención al cliente
    <option value="Proveedores">Contacto de proveedores
    </select>    </td>
</tr>
<tr>
    <td colspan="2" align="center"><input type="button" value="Enviar" onclick="valida_envia()"></td>
</tr>
</table>

</form>


</body>
</html> 
__________________
************************
"La bondad es simple; la maldad, múltiple"
  #2 (permalink)  
Antiguo 22/09/2008, 10:14
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 19 años, 8 meses
Puntos: 839
Exclamación Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Primero, hay un error en tu código, ya que estás usando el evento onclick para habilitar/deshabilitar los input pero sin comprobar que el radio en cuestión esté seleccionado (checked) o no.

Segundo, para validar solo si están habilitados puedes poner una condicional:
Código javascript:
Ver original
  1. if (!elemento.disabled) { /* Validar */ }
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #3 (permalink)  
Antiguo 22/09/2008, 11:11
Avatar de webbeginner  
Fecha de Ingreso: noviembre-2004
Mensajes: 241
Antigüedad: 20 años, 2 meses
Puntos: 2
Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Cita:
Iniciado por David el Grande Ver Mensaje
Primero, hay un error en tu código, ya que estás usando el evento onclick para habilitar/deshabilitar los input pero sin comprobar que el radio en cuestión esté seleccionado (checked) o no.

Segundo, para validar solo si están habilitados puedes poner una condicional:
Código javascript:
Ver original
  1. if (!elemento.disabled) { /* Validar */ }
Gracias por responder David el Grande !!!

Sobre tu primer observación no lo hice porque no se como hacerlo comoprobando el radio

sobre tu segunda observación no se si tenga que poner algo mas ademas de la linea que escribes, la coloque justo antes de la validación tal como lo muestro en mi codigo, pero deshabilita la validación para todos los casos.

Mi codigo:

Código:
<html>
<head>
    <title>Ejemplo de validación de un formulario</title>
    
<script>
     
function validarEntero(valor){ 
      //intento convertir a entero. 
     //si era un entero no le afecta, si no lo era lo intenta convertir 
     valor = parseInt(valor) 

      //Compruebo si es un valor numérico 
      if (isNaN(valor)) { 
            //entonces (no es numero) devuelvo el valor cadena vacia 
            return "" 
      }else{ 
            //En caso contrario (Si era un número) devuelvo el valor 
            return valor 
      } 
} 

function valida_envia(){
 if (!nombre.disabled) {
    //valido el nombre
    if (document.fvalida.nombre.value.length==0){
        alert("Tiene que escribir su nombre")
        document.fvalida.nombre.focus()
        return 0;
    }
	}
    
    //valido la edad. tiene que ser entero mayor que 18
    edad = document.fvalida.edad.value
    edad = validarEntero(edad)
    document.fvalida.edad.value=edad
    if (edad==""){
        alert("Tiene que introducir un número entero en su edad.")
        document.fvalida.edad.focus()
        return 0;
    }else{
        if (edad<18){
            alert("Debe ser mayor de 18 años.")
            document.fvalida.edad.focus()
            return 0;
        }
    }
    
    //valido el interés
    if (document.fvalida.interes.selectedIndex==0){
        alert("Debe seleccionar un motivo de su contacto.")
        document.fvalida.interes.focus()
        return 0;
    }
    
    //el formulario se envia
    alert("Muchas gracias por enviar el formulario");
    document.fvalida.submit();
}
</script>
</head>

<body>

<form name="fvalida">
<table>
<tr>
  <td>¿Tiene Registro?</td>
  <td><p>
    <label>
      <input name="GrupoOpciones1" type="radio" id="GrupoOpciones1_0" onClick="document.getElementById('nombre').disabled=false;document.getElementById('edad').disabled=false;" value="Si"/>
      Si</label>
    <br>
    <label>
      <input name="GrupoOpciones1" type="radio" id="GrupoOpciones1_1" onClick="document.getElementById('nombre').disabled=true;document.getElementById('edad').disabled=true;" value="No"/>
      No</label>
    <br>
  </p></td>
</tr>
<tr>

    <td>Nombre: </td>
    <td><input type="text" name="nombre" size="30" maxlength="100" id= "nombre" ></td>
</tr>
<tr>
    <td>Edad: </td>
    <td><input type="text" name="edad" size="3" maxlength="2" id="edad" ></td>
</tr>
<tr>
    <td>Interés:</td>

    <td>
    <select name=interes>
    <option value="Elegir">Elegir
    <option value="Comercial">Contacto comercial
    <option value="Clientes">Atención al cliente
    <option value="Proveedores">Contacto de proveedores
    </select>    </td>
</tr>
<tr>
    <td colspan="2" align="center"><input type="button" value="Enviar" onClick="valida_envia()"></td>
</tr>
</table>

</form>




</body>
</html>
tambien lo intenté así
Código:
 if (!elements.disabled) {
    //valido el nombre
    if (document.fvalida.nombre.value.length==0){
	
        alert("Tiene que escribir su nombre")
        document.fvalida.nombre.focus()
        return 0;
    }
	}
Pero me dice que "elements" no esta definido :(

Me podrias explicar un poquito mas?

Gracias
__________________
************************
"La bondad es simple; la maldad, múltiple"

Última edición por webbeginner; 22/09/2008 a las 11:17
  #4 (permalink)  
Antiguo 22/09/2008, 11:21
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 19 años, 8 meses
Puntos: 839
Exclamación Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Es que en vez de poner "nombre" debes poner la referencia al objeto que sería:
Código:
document.fvalida.nombre
Y para lo de lo que te dije de los radio, en vez de poner:
Código javascript:
Ver original
  1. objeto.disabled = true;
Coloca:
Código javascript:
Ver original
  1. objeto.disabled = this.checked;
Aunque para el otro radio habrá que cambiar un poco, pero seguro que ya sabrás cómo hacerlo.
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #5 (permalink)  
Antiguo 22/09/2008, 11:43
Avatar de webbeginner  
Fecha de Ingreso: noviembre-2004
Mensajes: 241
Antigüedad: 20 años, 2 meses
Puntos: 2
Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Muchas Gracias David !!
Ya funciona !


Cita:
Iniciado por David el Grande Ver Mensaje
Y para lo de lo que te dije de los radio, en vez de poner:
Código javascript:
Ver original
  1. objeto.disabled = true;
Coloca:
Código javascript:
Ver original
  1. objeto.disabled = this.checked;
Aunque para el otro radio habrá que cambiar un poco, pero seguro que ya sabrás cómo hacerlo.
Solo una duda sobre esto, sin escribir esto que me comentas ya está (aparentemente) funcionando bien, pero si en tu opinion (experiencia) consideras que esta erroneo mi codigo me gustaría mucho APRENDER como es la forma correcta de hacerlo podrias ampliar esto ultimo ?, ya que lo cambie tal cual lo indicas "objeto.disabled = true;" por "objeto.disabled = this.checked"

Gracias !
__________________
************************
"La bondad es simple; la maldad, múltiple"

Última edición por webbeginner; 22/09/2008 a las 11:44 Razón: Mejorar redaccion
  #6 (permalink)  
Antiguo 22/09/2008, 11:49
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 19 años, 8 meses
Puntos: 839
De acuerdo Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Lo siento, me equivoqué, aunque se produzcan varias veces el evento onclick igual va a funcionar . En este caso no tendrás que cambiar nada. Aunque no sé por qué acostumbro comprobar si el radio está marcado .
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #7 (permalink)  
Antiguo 22/09/2008, 12:00
Avatar de webbeginner  
Fecha de Ingreso: noviembre-2004
Mensajes: 241
Antigüedad: 20 años, 2 meses
Puntos: 2
Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

ok, algun día me saldra la duda en otro caso diferente

Saludos DAVID y gracias de nuevo
__________________
************************
"La bondad es simple; la maldad, múltiple"
  #8 (permalink)  
Antiguo 28/11/2008, 11:19
 
Fecha de Ingreso: mayo-2008
Mensajes: 181
Antigüedad: 16 años, 7 meses
Puntos: 0
Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

//valido el año. tiene que ser 2008 o menor
edad = document.fvalida.edad.value
edad = validarEntero(edad)
document.fvalida.edad.value=edad
if (edad==""){
alert("Tiene que introducir el año actual.")
document.fvalida.edad.focus()
return 0;
}else{
if (edad>2008){
alert("El año debe ser 2008")
document.fvalida.edad.focus()
return 0;
}
He definido que debe de ser 2008 pero tengo un problema si se pone 2050 por ejemplo sale el mensaje El Año debe de ser 2008.

Pero si se pone 1999 no da error y se acepta, y no quiero que se acepte.
¿Se puede hacer?

Gracias
  #9 (permalink)  
Antiguo 28/11/2008, 11:25
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 19 años, 8 meses
Puntos: 839
Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Hola, nightduke. Por favor, cuando tengas una duda, crea un nuevo tema. Y en cuanto a tu pregunta, ¿qué tienes en la función validarEntero?. También, prueba usando parseInt(edad) a la hora de comparar.
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #10 (permalink)  
Antiguo 28/11/2008, 11:43
 
Fecha de Ingreso: mayo-2008
Mensajes: 181
Antigüedad: 16 años, 7 meses
Puntos: 0
Respuesta: Como modificar una validación en un form dependiendo si el elemento esta h

Cita:
Iniciado por David el Grande Ver Mensaje
Hola, nightduke. Por favor, cuando tengas una duda, crea un nuevo tema. Y en cuanto a tu pregunta, ¿qué tienes en la función validarEntero?. También, prueba usando parseInt(edad) a la hora de comparar.
Ok Gracias y lo siento, al final he cambiado cambiando > por =

Con lo que tu que me comentas hago comparaciones ?

Gracias
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:26.