tecnologia postulante

curriculumsearch/src/main/java/com/roshka/modelo/PostulanteTecnologia.java

 package com.roshka.modelo;
 
+import javax.persistence.CascadeType;
 import javax.persistence.Column;
 import javax.persistence.Entity;
 import javax.persistence.GeneratedValue;
@@ -18,7 +19,7 @@ public class PostulanteTecnologia {
    private long id ;
    @Column(name="nivel")
    private Long nivel;
-    @ManyToOne()
+    @ManyToOne(cascade = CascadeType.PERSIST)
     @JoinColumn
    private Tecnologia tecnologia;
    @ManyToOne()

curriculumsearch/src/main/resources/static/main.js

@@ -18,7 +18,6 @@ function agregarFieldExpierncia(){
     const div = document.querySelector("#experiencias")
     const div1 = document.createElement('div');
     let content='<ul>'
-    
     for (let index = 0; index < experiencias.length; index++) {
         const exp = experiencias[index];
         if(exp==null) continue;
@@ -37,13 +36,60 @@ function agregarFieldExpierncia(){
     cont_experiencia++;
 
 }
+/*--------------------------------------------------------------------*/
+function agregarFieldTecnologia(){
+    //recoger del form
+    const pairs = {};
+    const formtecn = document.querySelector("[name=tecnologia-form]");
+    const formData = new FormData(formtecn);
+    for (const [name, value] of formData){
+        pairs[name] = value
+    }
+    tecnologias[cont_tecnologia]={}
+    tecnologias[cont_tecnologia]["tecnologia"]={nombre: pairs.nombre}
+    tecnologias[cont_tecnologia]["nivel"]=pairs.nivel
+    //tecnologias[cont_tecnologia] = pairs;
+    formtecn.reset();
+    //imprimir lista actualizada
+    const div = document.querySelector("#tecnologias")
+    const div1 = document.createElement('div');
+    console.log(tecnologias[0])
 
+    let content1='<ul>'
+    for (let index = 0; index < tecnologias.length; index++) {
+        const tecn = tecnologias[index];
+        if(tecn==null) continue;
+        content1 += `
+        <li id="tecn-${index}">        
+            ${tecn.tecnologia.nombre} 
+            <button type="button" onclick="eliminarTecnologia(event)">Eliminar</button>
+        </li>
+        
+        `
+    }
+    content1 += "</ul>" 
+    div1.innerHTML = content1
+    div.innerHTML = '';
+    div.appendChild(div1);
+    cont_tecnologia++;
+}
+
+
+/*--------------------------------------------------------------------*/
 function eliminarExperiencia(event) {
     //eliminar del array
     experiencias[event.target.parentElement.id.split("-")[1]]=null
     //eliminar en html
     event.target.parentElement.remove()
 }
+/*----------------------------------------------------------------- */
+function eliminarTecnologia(event) {
+    //eliminar del array
+    tecnologias[event.target.parentElement.id.split("-")[1]]=null
+    //eliminar en html
+    event.target.parentElement.remove()
+}
+/*----------------------------------------------------------------- */
 function serializeJSON (form) {
     // Create a new FormData object
     const formData = new FormData(form);

curriculumsearch/src/main/webapp/jsp/postulante-form.jsp

@@ -76,6 +76,12 @@
         <div id="experiencias">
 
         </div>
+        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#tecnologiaForm">
+          Agregar Tecnologia
+        </button>
+        <div id="tecnologias"> 
+
+      </div>
         <button type="submit" class="btn btn-primary">Submit</button>
       </form>
 
@@ -109,12 +115,37 @@
           </div>
         </div>
       </div>
-
+    <!--------------------------------------------------------------------------------------->
+      <div class="modal fade" id="tecnologiaForm" tabindex="-2" role="dialog" aria-labelledby="tecnologiaForm" aria-hidden="true">
+        <div class="modal-dialog" role="document">
+          <div class="modal-content">
+            <div class="modal-header">
+              <h5 class="modal-title" id="exampleModalLabel" >tecnologia</h5>
+              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                <span aria-hidden="true">&times;</span>
+              </button>
+            </div>
+            <div class="modal-body">
+                <form name="tecnologia-form">
+                    <label for="nombre" class="form-label">Nombre</label>
+                    <input type="text" class="form-control" name="nombre" id="nombre" >
+                    <label for="nivel" class="form-label">Nivel</label>
+                    <input type="number" class="form-control" name="nivel" id="nivel" >
+                </form>
+            </div>
+            <div class="modal-footer">
+              <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+              <button type="button" class="btn btn-primary" onclick="agregarFieldTecnologia()" data-dismiss="modal">Agregar</button>
+            </div>
+          </div>
+        </div>
+      </div>      
+    <!--------------------------------------------------------------------------------------->
     <!-- Optional JavaScript; choose one of the two! -->
 
     <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
-<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
     <script src="./main.js"></script>
   </body>
 </html>
\ No newline at end of file