Hola a todos, tengo una encuesta con radio button en la primera pregunta tengo 2 opciones SI o NO si selecciona SI se abre un div oculto con otras preguntas y si selecciona NO abre otro div oculto con otras preguntas diferentes. La estructura más o menos es la siguiente:
capa inicial---siempre visible
capa preguntas1-----oculta
capa preguntas2-----oculta
capa final----siempre visible (Botones)
Todo esto ya me funciona correctamente el problema que tengo es al validar no se como hacer para validarlos y no me envie datos vacios les dejo mi codigo que estoy utilizando esperero me puedan dar una orientacion, de antemano gracias.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script type='text/javascript' src='formexp.js'></script>
<script>
function expandir_completo(){
if (document.f1.p_1_0.checked){
xDisplay('capaexpansion2', 'block')
xDisplay('capaexpansion3', 'none')
}else{
xDisplay('capaexpansion2', 'none')
xDisplay('capaexpansion3', 'block')
}
}
function expandir_corto(){
if (document.f1.p_1_1.checked){
xDisplay('capaexpansion3', 'block')
xDisplay('capaexpansion2', 'none')
}else{
xDisplay('capaexpansion3', 'none')
xDisplay('capaexpansion2', 'block')
}
}
function expandir_formulario2(){
if (document.f1.p_4_1.checked){
xDisplay('capaexpansion4', 'block')
}else{
xDisplay('capaexpansion4', 'none')
}
}
function ocultar_formulario2(){
if (document.f1.p_4_0.checked){
xDisplay('capaexpansion4', 'none')
}else{
xDisplay('capaexpansion4', 'block')
}
}
function marcar(){
marca_1();
}
function marca_1(){
if(document.f1.no_1_6.checked){
document.f1.otro_2.disabled=false
document.f1.otro_2.style.backgroundColor='#FFFFFF'
document.f1.otro_2.value=a1
document.f1.otro_2.focus()
}
else{
document.f1.otro_2.disabled=true
document.f1.otro_2.style.backgroundColor='#D6D3CE'
a1=document.f1.otro_2.value
document.f1.otro_2.value=""
}
}
function resetear(){
document.f1.p_1_0.checked=false;
document.f1.p_1_1.checked=false;
xDisplay('capaexpansion2', 'none')
xDisplay('capaexpansion3', 'none')
xDisplay('capaexpansion4', 'none')
document.f1.p_2_0.checked=false;
document.f1.p_2_1.checked=false;
document.f1.p_3_0.checked=false;
document.f1.p_3_1.checked=false;
document.f1.p_4_0.checked=false;
document.f1.p_4_1.checked=false;
document.f1.p_6_0.checked=false;
document.f1.p_6_1.checked=false;
document.f1.p_7_0.checked=false;
document.f1.p_7_1.checked=false;
document.f1.si_4_0.checked=false;
document.f1.si_4_1.checked=false;
document.f1.si_4_2.checked=false;
document.f1.si_4_3.checked=false;
document.f1.si_4_4.checked=false;
document.f1.si_4_5.checked=false;
document.f1.si_4_6.checked=false;
document.f1.no_1_0.checked=false;
document.f1.no_1_1.checked=false;
document.f1.no_1_2.checked=false;
document.f1.no_1_3.checked=false;
document.f1.no_1_4.checked=false;
document.f1.no_1_5.checked=false;
document.f1.no_1_6.checked=false;
document.f1.otro_2.disabled=true;
document.f1.otro_2.style.backgroundColor='#D6D3CE' ;
a1=document.f1.otro_2.value;
document.f1.otro_2.value="";
a1=document.f1.p_5.value;
document.f1.p_5.value="";
}
</script>
</script>
<style type="text/css">
#capainicio{
position:relative;
}
#capaexpansion2{
position:relative;
display:none;
}
#capaexpansion3{
position:relative;
display:none;
}
#capaexpansion4{
position:relative;
display:none;
}
#capafinal{
position:relative;
}
</style>
</head>
<body onload="marca_1()">
<form name=f1>
<div id=capainicio>Pregunta 1<br />
<br />
<label>
<input type="radio" name="p_1" value="SI" id="p_1_0" onClick="expandir_completo()" />
<span class="opciones"> SI</span></label>
<span class="opciones"><br />
<label>
<input type="radio" name="p_1" value="NO" id="p_1_1" onClick="expandir_corto()" />
NO</label></div>
<div id=capaexpansion2>Pregunta 2<br />
<p>
<label>
<input type="radio" name="p_2" value="SI" id="p_2_0" />
<span class="opciones">SI</span></label>
<span class="opciones"><br />
<label>
<input type="radio" name="p_2" value="NO" id="p_2_1" />
NO</label>
</span>
<label></label>
<br />
<br />
<span class="texto">Pregunta 3<br />
</p>
<p>
<label>
<input type="radio" name="p_3" value="SI" id="p_3_0" />
<span class="opciones">SI</span></label>
<span class="opciones"><br />
<label>
<input type="radio" name="p_3" value="NO" id="p_3_1" />
NO</label>
<br />
</span><br />
<span class="texto"><strong>Pregunta 4<br />
</p>
<p>
<label>
<input type="radio" name="p_4" value="NO" id="p_4_0" onClick="ocultar_formulario2()" />
<span class="opciones">NO</span></label>
<span class="opciones"><br />
<label>
<input type="radio" name="p_4" value="SI" id="p_4_1" onClick="expandir_formulario2()" />
SI</label>
</span>
<div id=capaexpansion4>
<table width="574" border="0" cellpadding="2" cellspacing="2" class="opciones">
<tr>
<td width=69> </td>
<td width="428">Si contestas que SI</td>
</tr>
<tr>
<td> </td>
<td><p>
<label>
<input type="checkbox" name="si_4_0" value="SI" id="si_4_0" />
1</label>
<br />
<label>
<input type="checkbox" name="si_4_1" value="SI" id="si_4_1" />
2</label>
<br />
<label>
<input type="checkbox" name="si_4_2" value="SI" id="si_4_2" />
3</label>
<br />
<label>
<input type="checkbox" name="si_4_3" value="SI" id="si_4_3" />
4</label>
<br />
<label>
<input type="checkbox" name="si_4_4" value="SI" id="si_4_4" />
5</label>
<br />
<label>
<input type="checkbox" name="si_4_5" value="SI" id="si_4_5" />
6</label>
<br />
<label>
<input type="checkbox" name="si_4_6" value="SI" id="si_4_6" />
7</label>
<br />
</p></td>
</tr>
</table>
</div>
<span class="texto">
</p>
<strong>Pregunta 5<br />
<br />
<label>
<input name="p_5" type="text" id="p_5" size="70" />
</label>
<p><span class="texto">Pregunta 6<br />
</p>
<p>
<label>
<input type="radio" name="p_6" value="SI" id="p_6_0" />
<span class="opciones">SI</span></label>
<span class="opciones"><br />
<label>
<input type="radio" name="p_6" value="NO" id="p_6_1" />
NO</label>
<br />
</span></p>
<p><span class="texto">Pregunta 7<br />
</p>
<p>
<label>
<input type="radio" name="p_7" value="SI" id="p_7_0" />
<span class="opciones">SI</span></label>
<span class="opciones"><br />
<label>
<input type="radio" name="p_7" value="NO" id="p_7_1" />
NO</label></div>
<div id=capaexpansion3><table width="605" border="0" cellpadding="2" cellspacing="2" class="opciones">
<tr>
<td width=44> </td>
<td width="525">si contestas que NO, ¿Porque?</td>
</tr>
<tr>
<td> </td>
<td><p>
<label>
<input type="checkbox" name="no_1_0" value="SI" id="no_1_0" />
1</label>
<br />
<label>
<input type="checkbox" name="no_1_1" value="SI" id="no_1_1" />
2</label>
<br />
<label>
<input type="checkbox" name="no_1_2" value="SI" id="no_1_2" />
3</label>
<br />
<label>
<input type="checkbox" name="no_1_3" value="SI" id="no_1_3" />
4</label>
<br />
<label>
<input type="checkbox" name="no_1_4" value="SI" id="no_1_4" />
5</label>
<br />
<label>
<input type="checkbox" name="no_1_5" value="SI" id="no_1_5" />
6</label>
<br />
<label>
<input type="checkbox" name="no_1_6" value="SI" id="no_1_6" onclick="marca_1()" />
Otro</label>
<label>
<input name="otro_2" type="text" id="otro_2" size="60" style="background-color: #D6D3CE" disabled="disabled" />
</label>
<br />
</p></td>
</tr>
</table></div>
<div id=capafinal><table width="600" border="0" align="left" cellpadding="0" cellspacing="10">
<tr>
<td width="72" align="right"><label>
<input name="button" type="submit" class="boton" id="button" value="ENVIAR" />
</label></td>
<td width="498"><label>
<input type="button" onclick="resetear()" name="button2" id="button2" value="BORRAR" />
</label> </tr>
</table>
</div>
</form>
</body>
</html>
