Si lo que quieres es que después de seleccionar una opción todas las demás se desactiven puedes usar esto:
function desactivarOpcionesNoSeleccionadas() {
var select = document.getElementById("tipo_registro_L");
var selectOptions = select.getElementsByTagName("option");
if (select.selectedIndex) {
for (var i = 0; i < select.length; i++) {
if (selectOptions[i] != selectOptions[select.selectedIndex]) {
selectOptions[i].disabled = true;
}
}
}
}
<div class="form-group" >
<label>Tipo registro *</label>
<select class="form-control" id="tipo_registro_L" name="tipo_registro_L" onchange='desactivarOpcionesNoSeleccionadas()'>
<option value="0" selected>SELECCIONE UN TIPO</option>
<option value="nino">NIÑO</option>
<option value="adulto">ADULTO</option>
</select>
</div>
Explicación:
El atributo onchange="desactivarOpcionesNoSeleccionadas()"
hará que cuando el usuario seleccione una opción, llamara la función desactivarOpcionesNoSeleecionadas()"
.
En esa función, declaramos unas variables que apuntan hacia el elemento <select>
con id="tipo_registro_L"
y otra que apunta hacia una lista de todos los <option>
dentro del <select>
del que hablamos anteriormente.
if (select.selectedIndex) { //... }
verificara que efectivamente haya una opción seleccionada.
Dentro del if(){}
iteramos por todas las opciones dentro del <select>
y verificamos si el <option>
actual es diferente al <option>
seleccionado. Si es asi, modificamos su atributo disabled
y lo igualamos a true
. Si es el atributo <option>
es el seleccionado, no hacemos nada, dejandolo activo.