diff --git a/curriculumsearch/src/main/java/com/roshka/controller/PostulanteRRHHController.java b/curriculumsearch/src/main/java/com/roshka/controller/PostulanteRRHHController.java
index d7e00c5..87df216 100644
--- a/curriculumsearch/src/main/java/com/roshka/controller/PostulanteRRHHController.java
+++ b/curriculumsearch/src/main/java/com/roshka/controller/PostulanteRRHHController.java
@@ -5,9 +5,8 @@ import java.util.ArrayList;
 
 import java.util.List;
 
-
-
-
+import com.fasterxml.jackson.core.JsonProcessingException;
+import com.fasterxml.jackson.databind.ObjectMapper;
 import com.roshka.DTO.PostulanteListaDTO;
 import com.roshka.modelo.*;
 import com.roshka.modelo.Disponibilidad;
@@ -97,7 +96,15 @@ public class PostulanteRRHHController {
         model.addAttribute("disponibilidades", Disponibilidad.values());
         model.addAttribute("institucionesEducativas", institucionRepository.findAll());
         model.addAttribute("estadoP", EstadoPostulante.values());
-        model.addAttribute("convocatoriaC", cargoRepo.findAll());
+        model.addAttribute("cargos", carRepo.findAll());
+        model.addAttribute("cargoRepo", cargoRepo);
+        //model.addAttribute("convocatoriaC", cargoRepo.findAll());
+        try {
+            model.addAttribute("convocatoriaC", new ObjectMapper().writeValueAsString(cargoRepo.findAll()));
+        } catch (JsonProcessingException er) {
+            // TODO Auto-generated catch block
+            er.printStackTrace();
+        }
         Page<Postulante> postulantesPag = post.postulantesMultiFiltro(nombre == null || nombre.trim().isEmpty() ? new TypedParameterValue(StringType.INSTANCE,null) : new TypedParameterValue(StringType.INSTANCE,"%"+nombre+"%"),dispo, lvlEng, lvlTec, tecId, instId,cargoId,page,estado,convId);
         List<Postulante> postulantes = postulantesPag.getContent();
         List<PostulanteListaDTO> postulantesDTO = new ArrayList<>();
diff --git a/curriculumsearch/src/main/java/com/roshka/modelo/Cargo.java b/curriculumsearch/src/main/java/com/roshka/modelo/Cargo.java
index ff93814..932a344 100644
--- a/curriculumsearch/src/main/java/com/roshka/modelo/Cargo.java
+++ b/curriculumsearch/src/main/java/com/roshka/modelo/Cargo.java
@@ -26,6 +26,22 @@ public class Cargo {
     @Column(name = "nombre")
     private String nombre;
 
+    public Long getId() {
+        return this.id;
+    }
+
+    public void setId(Long id) {
+        this.id = id;
+    }
+
+    public String getNombre() {
+        return this.nombre;
+    }
+
+    public void setNombre(String nombre) {
+        this.nombre = nombre;
+    }
+
     @OneToMany(mappedBy = "cargo")
     @JsonManagedReference
     private List<ConvocatoriaCargo> convocatorias;
diff --git a/curriculumsearch/src/main/resources/static/Convo.js b/curriculumsearch/src/main/resources/static/Convo.js
new file mode 100644
index 0000000..f0f0491
--- /dev/null
+++ b/curriculumsearch/src/main/resources/static/Convo.js
@@ -0,0 +1,22 @@
+const cargoSelect = document.querySelector("#cargoId");
+
+function listarConvocatorias(id){
+    const ConvocatoriaAmostrar = convocatorias.filter(c=>c.cargoId==id);
+    const convocatoria = document.querySelector("select[name=convId]");
+    const frag = document.createDocumentFragment();
+    for (const conv of ConvocatoriaAmostrar) {
+        const opt = document.createElement("option");    
+        opt.value = conv.id;
+        if(conv.fechaFin!=null){
+            opt.innerHTML ="Desde :"+new Date(conv.fechaInicio)+"-"+" Hasta :"+new Date(conv.fechaFin);
+        }else{
+            opt.innerHTML ="Desde :"+new Date(conv.fechaInicio)
+        }
+        opt.setAttribute("data-CargoId",conv.cargoId);
+        frag.appendChild(opt)
+    }
+    convocatoria.replaceChildren(frag);
+     
+}
+listarConvocatorias(cargoSelect.value);
+cargoSelect.addEventListener("change",evt => listarConvocatorias(evt.target.value))
diff --git a/curriculumsearch/src/main/webapp/jsp/postulantes.jsp b/curriculumsearch/src/main/webapp/jsp/postulantes.jsp
index 3de212c..8ecef17 100644
--- a/curriculumsearch/src/main/webapp/jsp/postulantes.jsp
+++ b/curriculumsearch/src/main/webapp/jsp/postulantes.jsp
@@ -151,20 +151,33 @@
           <div class="col">
             <div class="row">
               <div class="col-auto col-md-4">
-                <label class="form-label" for="convId">Convocatoria</label>
+                <label class="form-label" for="cargoId">Cargo</label>
               </div>
               <div class="col-auto col-md-8">
-                <select class="form-select form-select-sm " name="convId" id="convId">
+                <select class="form-select form-select-sm " name="cargoId" id="cargoId">
                   <option value="">Seleccione una opcion</option>
-                  <c:forEach items="${convocatoriaC}" var="convo">
-                    <option value="${convo.id}" ${param.convId == convo.id ? "selected" : ""}>${convo.getCargo().getNombre()}</option>
+                  <c:forEach items="${cargos}" var="cargo">
+                    <option value="${cargo.id}" ${param.cargoId == cargo.id ? "selected" : ""}>${cargo.getNombre()}</option>
                   </c:forEach>
                 </select>
               </div>
             </div>           
           </div>
-         </div>
-        </form>
+          
+        <div class="col">
+          <div class="row">
+            <div class="col-auto col-md-4">
+              <label class="form-label" for="convId">Convocatoria</label>
+            </div>
+            <div class="col-auto col-md-8">
+              <select class="form-select form-select-sm " name="convId" id="convId">
+                <option value="">Seleccione una opcion</option>
+              </select>
+            </div>
+          </div>           
+        </div>
+       </div>
+      </form>
       </div>
       <div class="card text-dark bg-light mt-3">
         
@@ -219,10 +232,15 @@
         </div>
       </div>
      
+    
       
     </layout:put>
     <layout:put block="scripts" type="APPEND">
       <script>
+        var convocatorias = ${convocatoriaC};
+      </script>
+      <script src="./Convo.js"></script>
+      <script>
         function habilitarLvlTec(){
           //si se selecciono una tecnologia entonces permitir seleccionar un nivel
           lvlTec.disabled = tecId.value == false
@@ -231,6 +249,7 @@
           }
           
         }
+
         function buscarPagina(nro){
           nro--
           const aBuscar = 'nroPagina='+nro
@@ -245,6 +264,8 @@
         const lvlTec = document.querySelector("#lvlTec");
         tecId.addEventListener('change',habilitarLvlTec);
         habilitarLvlTec()
+
+
       </script>
     </layout:put>
 </layout:extends>