Me explicaré mejor y pidiendo las disculpas del caso paso a describir mi problema lo mejor que pueda:
Tengo un formulario que quiero validar con la biblioteca jsvalidate (la encontre en la web y se adecua a lo que quiero).
Tengo 2 select (select1=Asistente y select2=opc1) y un texbox=opc2.
-El select1 activa al select2 al elegir la opcion universitario .
-El select2 activa el textbox al elegir la opcion Otras.
Las funciones javascript propias que hacen lo antes mencionadas son las siguientes y el codigo html son los siguientes:
Código :
//funcion que habilita el select name=opc1 cuando se
//selecciona Universitario en el select name=Asistente
//ademas si se ve el campo de texto name=opc2 lo oculta
function habilitar(obj)
{
if(obj.options[0].selected==true || obj.options[2].selected==true)
{
document.formulario.opc1.disabled=true;
document.formulario.opc1[0].selected=true;
document.formulario.opc2.style.visibility = "hidden";
}
else
{document.formulario.opc1.disabled=false;}
}
//funcion que oculta/muestra campo de texto name=opc2 cuando se
//selecciona Otras en el select name=opc1
function ver(obj)
{
if(obj.options[obj.selectedIndex].text == "Otras")
{
document.formulario.opc2.style.visibility = "visible";
document.formulario.opc2.focus();
}
else
{
document.formulario.opc2.style.visibility = "hidden";
document.formulario.opc2.value = "";
document.formulario.opc2.blur();
}
}Código :
<html>
<head>
<title>Inscripción Online</title>
</head>
<body>
<h2>Módulo de Prueba de Inscripción Online</h2>
<form name="formulario" method="POST">
<label>Tipo de Asistente</label>
<select name="Asistente" class="jsrequired select-notfirst" onChange="habilitar(this);univ();">
<option value="" selected="selected">[Seleccione]</option>
<option value="Universitario">Universitario</option>
<option value="Profesional">Profesional</option>
</select>
<br>
<label>Universidad</label>
<select name="opc1" disabled="disabled" onChange="ver(this);univ();">
<option value="" selected="selected">[Seleccione su Universidad]</option>
<option value="UNALM">Universidad Nacional Agraria La Molina</option>
<option value="Otros">Otras</option>
</select>
<input id="newopc2" name="opc2" type="text" style="visibility:hidden" onKeyUp="univ();" size="50"/>
<input type="hidden" name="Universidad" ReadOnly>
<br>
<input name="inscribir" type="submit" value="Inscribir" />
<input name="borrar" type="reset" value="Borrar" />
</form>
</body>
</html>
Ahora para que la jsvalidate valide los tag input y select se le coloca el atributo class="jsrequired", pero no se como hacer para que:
De hecho el primer select1=Asistente tiene la class="jsrequired" ya por defecto (en eso no tengo problema)
1)El select2=opc1 sólo se validará si la opcion universitario es elegida en el select1=Asistente .
2)El textbox=opc2 sólo se validará si la opcion Otras es elegida en el select2=opc1 .
Bueno lo que he intentado para solucionar punto 2) es con
Código :
document.getElementById("newopc2").className = "jsrequired"; Entonces mi funcion ver quedaría asi:
Código :
function ver(obj)
{
if(obj.options[obj.selectedIndex].text == "Otras")
{
document.formulario.opc2.style.visibility = "visible";
document.getElementById("newopc2").className = "jsrequired";
document.formulario.opc2.focus();
}
else
{
document.formulario.opc2.style.visibility = "hidden";
document.formulario.opc2.value = "";
document.formulario.opc2.blur();
}
}Hecho esto no me sale el mensaje de error cuando no se llena este textbox, en que me estoy equivocando???
