Foros del Web - Ver Mensaje Individual - Select

emprear · #6 (**permalink**) 07/05/2012, 13:23

No sé si aún te haga falta, pero quizá esto te sirva

Código HTML:

Ver original<!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>
<title>Remover options</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
 
<script type="text/javascript">
//<![CDATA[
/* script */
function removerIndices(opcion,indices,combo,actual){
  var cActual = document.getElementById(actual).value;
   // console.log('Valor actual: ', cActual);
  if((cActual != "") && (cActual == opcion )){
  var elSel = document.getElementById(combo);
  elSel.disabled = false;
  var borrar = indices.split('|');
  // console.log('borrar: ', borrar[0]);
  var i;
  var e=0;
for (e=0; e<=borrar.length;e++){
 
  for (i = elSel.length - 1; i>=0; i--) {
// console.log('El indice: ',elSel.options[i].value);
    if (elSel.options[i].value == borrar[e]) {
      elSel.remove(i);
    }
  }
  
}
  
}
}
//]]>
</script>
</head>
<body>
<form action="#">
<select id="select1" onchange="removerIndices('A','3|1|2','select2',this.id);">
<option value="" selected="selected">seleccione letra</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
<br />
<select id="select2"  disabled="disabled" >
<option value="" selected="selected">seleccione número</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<br />
</form>
</body>
</html>

Esta función basicamente hace lo siguiente, de acuerdo a las opción seleccionada en un select, elimina opciones de otro select

Los parámetros que pasa son
removerIndices(opcion,indices,combo,actual)
dónde
opción = El valor del select actual que cumple la condición
indices = son los indices del select en que se borrarán dichos indices, si son mas de uno se separan por |
combo = es el id del combo en que se borraran los indices
actual = es el id del combo que hace el onchange

En el ejemplo, al hacer onchange en el combo 1, si la opción seleccionada es A, se eliminan del combo 2 los option de los indices 1,2, y 3.
El tema del disabled/enabled es opcional y cualquier combo puede actuar sobre otro independientemente. No son exactamente selects dependientes en la forma tradicional. Faltaría agregar, si fuese necesario alguna modificación para que las opciones válidas del combo 1 que eliminan opciones del combo 2 sean más de una.
Y se podría incluso agregar opciones en lugar de eliminarlas

Saludos