[SOLUCIONADO] hacer aparecer un div al seleccionar radiobutton

[catanzaro99]

Hola a todos:

Quizás ya respondieron esta pregunta infinidad de veces, pero estuve buscando en el buscador de aquí y no he encontrado nada, si ya hay un tema similar me pasan el link así no pierden tiempo con este tema... Gracias

Paso a detallar: Tengo un formulario que se muestra en un div inicial donde se pide que el usuario seleccione una de dos opciones mediante sendos radio.
Específicamente se pide si el usuario quiere ser contactado via fono y el usuario opta por SI o NO
Si opta por SI, hace visible un div oculto mediante style="display:none" para que complete unos text box donde completar sus teléfonos.
si opta por NO, hace visible otro div (también oculto) donde despliega otros textbox donde se le piden otros datos
Hacer aparecer los div no fue un gran problema usando:

Código HTML:

<label><input type="radio" name="contacto" onClick="document.getElementById('div1').style.display= this.checked?'':'none'">SI</label>

<label><input type="radio" name="contacto" onClick="document.getElementById('div2').style.display= this.checked?'':'none'">NO</label> 

El problema es que una vez visibles los divs no se vuelven a ocultar.
Es decir, supongamos que el usuario inicialmente seleccione SI (se despliega el div1) y luego decido seleccionar NO (que hace visible el div2) el div1 queda visible y mi intención es que si cambia de opción los div se oculten o se hagan visibles respectivamente.

Inicialmente encontre lo que me parecia una solución agregandole onBlur="document.getElementById('formdatesite').st yle.display='none'"

quedaba algo así
<label><input type="radio" name="contacto" onClick=" document.getElementById('div1').style.display= this.checked?'':'none'" onBlur="document.getElementById('formdatesite').st yle.display='none'">NO</label>
Pero al perder el foco para escribir en el div hecho visible el div se cerraba también...

Espero haber sido claro y si este no es el lugar adecuado a la pregunta pueden mover el post al lugar que le corresponda. Desde ya gracias...

[PIRRUMAN]

con una funcion

Código HTML:

<script type="text/javascript">
function MostrarOcultar(valor)
{
    var Div1=document.getElementById('div1');
    var Div2=document.getElementById('div2');
    var DivI=document.getElementById('inicial');
    Div1.style.display='none';
    Div2.style.display='none';
    DivI.style.display='none';
if(valor ==1)
{
  Div1.style.display='';
}
else if(valor==2)
{
  Div2.style.display='';
}
else
{
    DivI.style.display='';
}
}
</script>
 
<label><input type="radio" value="1" name="contacto" onClick="MostrarOcultar(this.value)">SI</label>
<label><input type="radio" value="2" name="contacto" onClick="MostrarOcultar(this.value)">NO</label>
 
<div id="inicial">Elija</div>
<div id="div1" style="display:none">div si</div>
<div id="div2" style="display:none">div no</div>
 

[catanzaro99]

Hola Pirruman

Eternamente agradecido, tu solución trabaja de maravillas con una pequeñísima salvedad, en tu código al seleccionar cualquiera de las opciones hace desaparecer al div inicial, algo muy bueno si no quiero que el usuario cambie su decisión.
Pero en mi caso prefiero dejar siempre visible la opción de elegir el SI o NO.
Por lo tanto modifique la linea 9 de tu código:
DivI.style.display='none';
por:
DivI.style.display='';

Esto permite al usuario cambiar su desición cuantas veces quiera...

Por lo demás el código funciona de mil maravillas, vuelvo a repetirte, eternamente agradecido...
vales 1000 puntos
Problema solucionado pueden cerrar el post... (¿O lo tengo que cerrar yo?)