Lo que sucede es que necesito que select 2 "familias"
cambie cuando se elige una orden de especies select 1
, pero solo cambia el del primer id
.
Intenté como se ve seleccionarlo por la clase, pero solo cambia la familia de acuerdo al orden de la primer ventana.
Debido a que esta parte de un formulario está presente en diferentes v. modales no quiero repetir ese mismo código para cada ventana
Lo modifiqué según tu comentario @Excorpion, pero el select 2 'familias' se muestra vacío ahora
CODIGO PHP -------------------------------------------
$orden=$_POST['orden'];
$sql = "SELECT
orden,
familia
from ordenes
where orden='$orden'";
$result = mysqli_query($conexion, $sql);
$cadena = "<select name='familia' class='form-control familia2'>";
while ($ver = mysqli_fetch_row($result)) {
$cadena = $cadena . '<option value=' . $ver[1] . '>' . utf8_encode($ver[1]) . '</option>';
}
echo $cadena . "</select>";
?>
CODIGO JS--------------------------------
$(document).ready(function() {
$('.ordena').val(1);
recargarLista();
$('.ordena').change(function() {
recargarLista();
});
})
function recargarLista() {
$.ajax({
type: "POST",
url: "ordenes2.php",
data: "orden=" + $('.ordena').val(),
success: function(res) {
$('.familia2').html(res);
}
});
}
HTML ---------------
<form class="form-horizontal collapse" id="form-'.$filaEspecies['id'].'" role="form" method="post" enctype="multipart/form-data">
<div class="form-group" >
<label for="ordena">Orden</label>
<select name="orden" class="form-control ordena" maxlength="50">
<option value="Blattodea">Blattodea</option>
<option value="Coleoptera">Coleoptera</option>
<option value="Lepidoptera">Lepidoptera</option>
<option value="Hemiptera">Hemiptera</option>
<option value="Hymenoptera">Hymenoptera</option>
<option value="Mantodea">Mantodea</option>
<option value="Megaloptera">Megaloptera</option>
<option value="Odonata">Odonata</option>
<option value="Orthoptera">Orthoptera</option>
<option value="Sin especificar">Sin especificar</option>
</select>
</div>
<label for="familia2">Familia</label>
<div name="familia" class="form-group familia2">
</div>