formulario select option con onchange

[jecavi20]

buenas tardes soy un novato en codigos y estoy tratando de hacer un formulario de registro con varias preguntas pero tengo un problema, es que tengo 6 campos de select option con onchange y necesito unirlos que solo sean 3 y cuando seleccione una opcion cambien los demas opciones con su respectiva respuesta, me recomendaron esta pagina haber si me podrian ayudar, para que vean mejor les pongo el codigo que tengo:

<script language="javascript">

function addOpt(oCntrl, iPos, sTxt, sVal){
var selOpcion=new Option(sTxt, sVal);
eval(oCntrl.options[iPos]=selOpcion);
}

function cambia(obj,Cntrl){
var oCntrl=document.getElementById(Cntrl);
while (oCntrl.length!=0){
oCntrl.remove(0);
}
switch (obj.selectedIndex){
case 0:
addOpt(oCntrl, 0, "Letra", "0");
break;
case 1:
addOpt(oCntrl, 0, "Letra", "0");
addOpt(oCntrl, 1, "A", "1");
addOpt(oCntrl, 2, "B", "2");
addOpt(oCntrl, 3, "C", "3");
addOpt(oCntrl, 4, "D", "4");
addOpt(oCntrl, 5, "E", "5");
break;
case 2:
addOpt(oCntrl, 0, "Letra", "0");
addOpt(oCntrl, 1, "A", "1");
addOpt(oCntrl, 2, "B", "2");
addOpt(oCntrl, 3, "C", "3");
addOpt(oCntrl, 4, "D", "4");
addOpt(oCntrl, 5, "E", "5");
break;
}
}

</script>

<script language="javascript">

function cambia2(obj,Cntrl){
var oCntrl=document.getElementById(Cntrl);
while (oCntrl.length!=0){
oCntrl.remove(0);
}

switch (obj.selectedIndex){
case 0:
addOpt(oCntrl, 0, "Apto", "0");
break;
case 1:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "Apto AA", "1");
addOpt(oCntrl, 2, "Apto 01", "2");
addOpt(oCntrl, 3, "Apto 10", "3");
addOpt(oCntrl, 4, "Apto 11", "4");
addOpt(oCntrl, 5, "Apto 20", "5");
addOpt(oCntrl, 6, "Apto 21", "6");
break;
case 2:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "Apto 02", "1");
addOpt(oCntrl, 2, "Apto 03", "2");
addOpt(oCntrl, 3, "Apto 12", "3");
addOpt(oCntrl, 4, "Apto 13", "4");
addOpt(oCntrl, 5, "Apto 22", "5");
addOpt(oCntrl, 6, "Apto 23", "6");
break;
case 3:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "Apto 04", "1");
addOpt(oCntrl, 2, "Apto 05", "2");
addOpt(oCntrl, 3, "Apto 14", "3");
addOpt(oCntrl, 4, "Apto 15", "4");
addOpt(oCntrl, 5, "Apto 24", "5");
addOpt(oCntrl, 6, "Apto 25", "6");
break;
case 4:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "Apto 06", "1");
addOpt(oCntrl, 2, "Apto 07", "2");
addOpt(oCntrl, 3, "Apto 16", "3");
addOpt(oCntrl, 4, "Apto 17", "4");
addOpt(oCntrl, 5, "Apto 26", "5");
addOpt(oCntrl, 6, "Apto 27", "6");
break;
case 5:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "Apto 08", "1");
addOpt(oCntrl, 2, "Apto 09", "2");
addOpt(oCntrl, 3, "Apto 18", "3");
addOpt(oCntrl, 4, "Apto 19", "4");
addOpt(oCntrl, 5, "Apto 28", "5");
addOpt(oCntrl, 6, "Apto 29", "6");
break;
}
}
</script>


<script language="javascript">

function cambia3(obj,Cntrl){
var oCntrl=document.getElementById(Cntrl);
while (oCntrl.length!=0){
oCntrl.remove(0);
}
switch (obj.selectedIndex){
case 0:
addOpt(oCntrl, 0, "Letra", "0");
break;
case 1:
addOpt(oCntrl, 0, "Letra", "0");
addOpt(oCntrl, 1, "A", "1");
addOpt(oCntrl, 2, "B", "2");
addOpt(oCntrl, 3, "C", "3");
addOpt(oCntrl, 4, "D", "4");
break;
case 2:
addOpt(oCntrl, 0, "Letra", "0");
addOpt(oCntrl, 1, "A", "1");
addOpt(oCntrl, 2, "B", "2");
addOpt(oCntrl, 3, "C", "3");
addOpt(oCntrl, 4, "D", "4");
break;
}
}
</script>

<script language="javascript">

function cambia4(obj,Cntrl){
var oCntrl=document.getElementById(Cntrl);
while (oCntrl.length!=0){
oCntrl.remove(0);
}

switch (obj.selectedIndex){
case 0:
addOpt(oCntrl, 0, "Apto", "0");
break;
case 1:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "A1", "1");
addOpt(oCntrl, 2, "A2 ", "2");
addOpt(oCntrl, 3, "A3", "3");
addOpt(oCntrl, 4, "A4", "4");
addOpt(oCntrl, 5, "A5 ", "5");
addOpt(oCntrl, 6, "A6", "6");
break;
case 2:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "B1 ", "1");
addOpt(oCntrl, 2, "B2", "2");
addOpt(oCntrl, 3, "B3", "3");
addOpt(oCntrl, 4, "B4 ", "4");
addOpt(oCntrl, 5, "B5", "5");
addOpt(oCntrl, 6, "B6", "6");
break;
case 3:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "C1 ", "1");
addOpt(oCntrl, 2, "C2", "2");
addOpt(oCntrl, 3, "C3", "3");
addOpt(oCntrl, 4, "C4 ", "4");
addOpt(oCntrl, 5, "C5", "5");
addOpt(oCntrl, 6, "C6", "6");
break;
case 4:
addOpt(oCntrl, 0, "Apto", "0");
addOpt(oCntrl, 1, "D1 ", "1");
addOpt(oCntrl, 2, "D2", "2");
addOpt(oCntrl, 3, "D3", "3");
addOpt(oCntrl, 4, "D4 ", "4");
addOpt(oCntrl, 5, "D5", "5");
addOpt(oCntrl, 6, "D6", "6");
break;
}
}
</script>
</head>
<body>


Bloque 29-30
<select name="bloque" id="bloque" onChange="cambia(this,'letra')">
<option value="0">Elige el Bloque</option>
<option value="29">29</option>
<option value="30">30</option>
</select>
Letra
<select name="letra" id="letra" onChange="cambia2(this,'apto')">
<option value="0">Letra</option>
</select>
Apto
<select name="apto" id="apto" onChange="cambia3(this,'')">
<option value="0">Apto</option>
</select>
</form>
<br></br>


Bloque 31-32
<select name="bloque2" id="bloque2" onChange="cambia3(this,'letra2')">
<option value="0">Elige el Bloque</option>
<option value="31">31</option>
<option value="32">32</option>
</select>
Letra
<select name="letra2" id="letra2" onChange="cambia4(this,'Apto2')">
<option value="0">Letra</option>
</select>
Apto
<select name="Apto2" id="Apto2" onChange="cambia5(this,'')">
<option value="0">Apto</option>
</select>

necesito que sean solo 3 select option en vez de 6, mas o menos como en esta imagen:

http://s2.subirimagenes.com/imagen/previo/thump_8487043select-option.png

pero que cada uno cambie con la informacion que le corresponde.
gracias de antemano por su ayuda y su tiempo

[#!drvy]

En vez de añadir opciones con javascript, yo los pondria directamente y luego solo ocultar/mostrar dependiendo de la selecion previa.

Ejemplo:

Código (javascript) [Seleccionar] Expandir

<script type="text/javascript">
var seleccion = (function(item){
/* Obtener el ID de la opcion selecionada */
var selected = item.options[item.selectedIndex].id;

/* Obtener los options dentro del segundo select */
var elementos = document.getElementById('select2').getElementsByTagName('option');

/* Por cada elemento en la lista "elementos" */
for (var i=0; i<elementos.length; i++){
/* Si el elemento tiene la misma clase que el id que se ha selecionado */
if (elementos[i].className === selected){
/* Le hacemos visible */
elementos[i].style.display='block';
} else {
/* Si no, le ocultamos. */
elementos[i].style.display='none';
}
}
});
</script>

Código (html4strict) [Seleccionar] Expandir

<select id="select1" onchange="seleccion(this)">
<option id="apto">Apto</option>
<option id="sus">Suspendido</option>
<option id="nose">No se sabe</option>
</select>

<select id="select2">
<option selected disabled>-------</option>
<option class="apto">Aprobado 1</option>
<option class="apto">Aprobado 2</option>

<option class="sus">Suspendido 1</option>
<option class="sus">Suspendido 2</option>

<option class="nose">No se sabe 1</option>
<option class="nose">No se sabe 2</option>
</select>

Demo jsFiddle

Saludos

[jecavi20]

Excelente muchísimas gracias ya lo resolví gracias a tu ayuda