Foros del Web » Programando para Internet » Javascript »

¿Cambiar la clase de input con javascript?

Estas en el tema de ¿Cambiar la clase de input con javascript? en el foro de Javascript en Foros del Web. Quiero hacer una validación y para eso necesito cambiarle la clase a un input desde javascript para ponerle ":required" Me gustaría saber si es así: ...
  #1 (permalink)  
Antiguo 30/03/2010, 11:56
 
Fecha de Ingreso: diciembre-2009
Ubicación: Cantabria, España
Mensajes: 174
Antigüedad: 14 años, 5 meses
Puntos: 2
¿Cambiar la clase de input con javascript?

Quiero hacer una validación y para eso necesito cambiarle la clase a un input desde javascript para ponerle ":required"

Me gustaría saber si es así:

Código:
document.formulario.comactual.className=":required";
El formulario tiene de id "formulario", el input tiene de id "comactual" y la clase por defecto del input es "required", que debe pasar a ":required" (con dos puntos delante)

Nose qué error comento, pero he leído por ahí que se hacía así y no me funciona...

Gracias
  #2 (permalink)  
Antiguo 30/03/2010, 12:10
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 19 años
Puntos: 839
Respuesta: ¿Cambiar la clase de input con javascript?

Depende. ¿Qué código estás usando para la validación? ¿En qué momento asigna los listeners a los input obligatorios?
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #3 (permalink)  
Antiguo 30/03/2010, 12:10
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.567
Antigüedad: 17 años, 1 mes
Puntos: 19
Respuesta: ¿Cambiar la clase de input con javascript?

Hola nuff,

No se muy bien si necesitas esto o no... pero es como yo lo haria:

Necesitas tener seleccionado el input, como supongo que el formulario lo vas a enviar seguramente todos los input's tendran id's... asi que por medio del id del input haces:


Código PHP:
//coloreamos
document.getElementById('aqui_el_id_del_input').style.background='green';
//cambiamos clase
document.getElementById('aqui_el_id_del_input').className='required'
Ten encuenta la mayuscula de className. Si deseas añadir la clase "required" y no cambiar las clases por "required" pon:

Código PHP:
//coloreamos
document.getElementById('aqui_el_id_del_input').style.background='green';
//cambiamos clase
document.getElementById('aqui_el_id_del_input').className=document.getElementById('aqui_el_id_del_input').className+' required'
  #4 (permalink)  
Antiguo 30/03/2010, 14:14
 
Fecha de Ingreso: diciembre-2009
Ubicación: Cantabria, España
Mensajes: 174
Antigüedad: 14 años, 5 meses
Puntos: 2
Respuesta: ¿Cambiar la clase de input con javascript?

La validación la hago con un plugin de jquery, para que el campo input sea obligatorio hay que ponerle como ":required" la clase.

Yo por defecto les tengo sin clase (o con una clase cualquiera, tanto me da) y quiero cambiarla a ":required" cuando selecciono sí en un select superior (lo del select ya funciona, sólo falta que cambie/agregue la clase ":required").

Probaré con lo que comenta salbatore y si necesito más ayuda comento de nuevo.

Muchas gracias a ambos por la rapidez.
  #5 (permalink)  
Antiguo 30/03/2010, 14:26
 
Fecha de Ingreso: diciembre-2009
Ubicación: Cantabria, España
Mensajes: 174
Antigüedad: 14 años, 5 meses
Puntos: 2
Respuesta: ¿Cambiar la clase de input con javascript?

Nada, no funciona

Lo que tengo es lo siguiente:

HTML:
Código:
¿Dispone de póliza anterior?<br />
	<form id="formulario">
            <select id="selector" onChange="muestraMas()">
    			<option value="No">No</option>
    			<option value="Si">Si</option>
    		</select>
            <br />
    		<div id="masElementos" style="display:none;">
            <p style="color:#F00">Por favor, introduzca los siguientes datos:</p>
    		Compañía actual:<br />
            <input type="text" id="comactual" name="comactual" />
            <br />
            Número de póliza actual:<br />
            <input type="text" id="numpoliza" name="numpoliza" />
            <br />
    		</div>
            <input type="submit" value="Enviar" class="enviar" />
	    </form>
JS:

Código:
		function muestraMas(){
				var var1=document.getElementById('selector').value;
				var var2=document.getElementById('masElementos');
				var var3=document.getElementById('comactual');
				var var4=document.getElementById('numpoliza');
				
				if(var1=="Si"){
					var2.style.display="block";
					//document.getElementById('comactual').className=document.getElementById('comactual').className+' :required';  
					document.getElementById('comactual').className=':required';
					//document.formulario.comactual.className=":required";
				}
				else{
					var2.style.display="none";		
				}
			}
La jugada que quiero hacer es la siguiente:

1) El cliente dice que "Si" dispone de póliza anterior.

2) Se muestra el div (Función JS "muestraMas()") con los dos campos extra (en este caso "comactual" y "numpoliza"

3) La función "muestraMas()" tiene doble función; mostrar el div "masElementos" y cambiar la clase de los dos imput (comactual y numpoliza) a ":required" para que desde ese momento sean campos obligatorios según vanadium (plugin de jquery que estoy utilizando)

Espero haberme explicado mejor.

Gracias.

Etiquetas: clase, input
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 05:07.