jQuery y css: ocultar / mostrar las opciones de selección con una determinada clase de css
En el código html he seleccionado opciones como esta:
<option value="1" class="myclass5">Value1</option>
En jQuery:
var cod = $(this).val(); // This is the value of another select: when the value
$("option[class^=myclass]").hide();
$("option[class^=myclass]").each(function () {
$("option[class^=myclass" + cod + "]").show();
});
EDITAR
Tengo dos selectos. Cuando selecciono un valor en la primera selección, el segundo debe completarse en consecuencia (tengo que evitar una llamada ajax).
Puse todos los valores de la segunda selección en una variable de sesión, pero mi problema está en seleccionar solo aquellos vinculados a la primera selección, por lo que estaba intentando a través de las clases de css.
EDIT2
<select name="firstselect">
<option value="0" selected="selected">Choose...</option>
<option value="1">Value1</option>
<option value="2">Value2</option>
<option value="3">Value3</option>
</select>
<select name="secondselect">
<option value="0" selected="selected">Choose...</option>
<option value="myclass1">Value11</option>
<option value="myclass1">Value12</option>
<option value="myclass1">Value13</option>
<option value="myclass2">Value21</option>
<option value="myclass2">Value22</option>
<option value="myclass2">Value23</option>
<option value="myclass3">Value31</option>
<option value="myclass3">Value32</option>
<option value="myclass3">Value33</option>
</select>
EDITAR3
Para mí, la solución de greenish es buena, pero hay un problema en IE que no logro explicar: cuando uso el botón de retroceso, el valor seleccionado por el usuario se "pierde", es decir, si inicio sesión en la consola, el usuario Valor seleccionado, veo su "índice" en la nueva selección clonada. En el código fuente de html, hay toda la selección original.
EDITAR 4
Resolví gracias a este post.