lo que quiero hacer por ejemplo es crear un select que se pueda elegir una categoría de producto, y luego más abajo esté otro select que se cargue con los productos de la categoria indicada mas arriba, Y SE PUEDAN ELEGIR VARIAS TAREAS paso mi ejemplo del modal (no es sobre productos, sino de oficios, para la explicacion de la pregunta utilice el escenario de productos):
servicios.php:
<!--=====================================
MODAL AGREGAR SERVICIO
======================================-->
<div id="modalAgregarServicio" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<form role="form" method="post" enctype="multipart/form-data">
<!--=====================================
CABEZA DEL MODAL
======================================-->
<div class="modal-header" style="background:#3c8dbc; color:white">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Solicitar servicio</h4>
</div>
<!--=====================================
CUERPO DEL MODAL
======================================-->
<div class="modal-body">
<div class="box-body">
<!-- ENTRADA PARA UBICACION -->
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-globe"></i></span>
<select class="form-control input-lg" name="nuevoPerfil">
<option value="">Seleccione ubicación</option>
<?php
$item = "idUsuario";
$valor = $_SESSION["idUsuario"];
$ubicaciones = ControladorServicios::ctrMostrarUbicaciones($item, $valor);
foreach ($ubicaciones as $key => $value){
echo '<option value="'.$value["idUbicacion"].'">'.$value["ubicacion"].'</option>';
}
?>
</select>
</div>
</div>
<!-- ENTRADA PARA OFICIOS -->
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-wrench"></i></span>
<select class="form-control input-lg" name="nuevoPerfil">
<option value="">Seleccione oficio</option>
<?php
$item = null;
$valor = null;
$oficios = ControladorServicios::ctrMostrarOficios($item, $valor);
foreach ($oficios as $key => $value){
echo '<option value="'.$value["idOficio"].'">'.$value["oficio"].'</option>';
}
?>
</select>
</div>
</div>
<!-- ENTRADA PARA FECHA -->
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
<input type="date" class="form-control input-lg" placeholder="Seleccionar fecha" name="nuevaFecha">
</div>
</div>
<!-- ENTRADA PARA HORA -->
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-clock-o"></i></span>
<input type="time" class="form-control input-lg" placeholder="Seleccionar hora" name="nuevaHora">
</div>
</div>
</div>
</div>
<!-- ENTRADA PARA TAREAS -->
<div class="form-group">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-globe"></i></span>
<?php
$item = "idOficio";
$valor = null; //COMO traer solo las tareas que este seleccionada en el oficio mas arriba
$tareas = ControladorServicios::ctrMostrarTareas($item, $valor);
foreach ($tareas as $key => $value){
echo '<input type="checkbox" value="'.$value["idTarea"].'">'.$value["tarea"].'';
}
?>
</div>
</div>
<!--=====================================
PIE DEL MODAL
======================================-->
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">Salir</button>
<button type="submit" class="btn btn-primary">¡Registrarme!</button>
</div>
<?php
$crearUsuario = new ControladorUsuarios();
$crearUsuario -> ctrCrearUsuario();
?>
</form>
</div>
</div>
</div>