Skip to content

th-app-java
th-app-java
Commit 92f8f929 by Cesar Giulano Gonzalez Maqueda
Options

Validacion en front de postulantes pt1

parent 101a8e0f
Showing with 101 additions and 20 deletions
curriculumsearch/src/main/java/com/roshka/controller/PostulanteController.java
...@@ -5,6 +5,7 @@ import java.util.Date; ...@@ -5,6 +5,7 @@ import java.util.Date;
import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletRequest;
import javax.validation.ConstraintViolationException; import javax.validation.ConstraintViolationException;
import javax.validation.Valid;
import com.roshka.modelo.Experiencia; import com.roshka.modelo.Experiencia;
import com.roshka.modelo.Postulante; import com.roshka.modelo.Postulante;
...@@ -14,6 +15,7 @@ import org.springframework.beans.factory.annotation.Autowired; ...@@ -14,6 +15,7 @@ import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus; import org.springframework.http.HttpStatus;
import org.springframework.http.ResponseEntity; import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Controller; import org.springframework.stereotype.Controller;
import org.springframework.validation.BindingResult;
import org.springframework.validation.FieldError; import org.springframework.validation.FieldError;
import org.springframework.web.bind.MethodArgumentNotValidException; import org.springframework.web.bind.MethodArgumentNotValidException;
import org.springframework.web.bind.annotation.*; import org.springframework.web.bind.annotation.*;
......
curriculumsearch/src/main/resources/static/main.js
...@@ -4,13 +4,51 @@ let cont_tecnologia = 0; ...@@ -4,13 +4,51 @@ let cont_tecnologia = 0;
const experiencias = []; const experiencias = [];
const estudios = []; const estudios = [];
const tecnologias = []; const tecnologias = [];
function agregarFieldExpierncia(){
const formValidator = function () {
'use strict'
// Fetch all the forms we want to apply custom Bootstrap validation styles to
var forms = document.querySelectorAll('.needs-validation')
var expForm = document.querySelector('#agregar-exp')
// Loop over them and prevent submission
Array.prototype.slice.call(forms)
.forEach(function (form) {
form.addEventListener('submit', function (event) {
if (!form.checkValidity()) {
event.preventDefault()
event.stopPropagation()
}
form.classList.add('was-validated')
}, false)
})
}
function agregarFieldExpierncia(event){
//recoger del form //recoger del form
const pairs = {}; const pairs = {};
const formexp = document.querySelector("[name=experiencia-form]"); const formexp = document.querySelector("[name=experiencia-form]");
const formData = new FormData(formexp); const formData = new FormData(formexp);
const reconocimientos = [{},{},{}]; const reconocimientos = [{},{},{}];
let pos_rec; let pos_rec;
let returnFlag = false;
formData.forEach((value, key)=>{
if((key === "institucion" || key === "cargo" || key === "fechaDesde")
&& value==="" && returnFlag == false){
console.log(key, value)
returnFlag = true;
}
});
if(returnFlag===true){
alert("Rellene Institucion, Fechas y Cargo como minimo");
return;
}
for (const [name, value] of formData){ for (const [name, value] of formData){
pos_rec = name.split("-");//rec-nombre-index pos_rec = name.split("-");//rec-nombre-index
if (pos_rec.length > 1) { if (pos_rec.length > 1) {
...@@ -45,7 +83,6 @@ function agregarFieldExpierncia(){ ...@@ -45,7 +83,6 @@ function agregarFieldExpierncia(){
div.innerHTML = ''; div.innerHTML = '';
div.appendChild(div1); div.appendChild(div1);
cont_experiencia++; cont_experiencia++;
} }
function eliminarExperiencia(event) { function eliminarExperiencia(event) {
...@@ -90,10 +127,14 @@ async function postData(url = '', data = {}) { ...@@ -90,10 +127,14 @@ async function postData(url = '', data = {}) {
}); });
return response; // parses JSON response into native JavaScript objects return response; // parses JSON response into native JavaScript objects
} }
formValidator()
form = document.querySelector("form"); form = document.querySelector("form");
form.addEventListener("submit",(evt)=>{ form.addEventListener("submit",(evt)=>{
// if (!form.checkValidity()) {
// evt.preventDefault()
// evt.stopPropagation()
// }
// form.classList.add('was-validated')
postData('postulante', serializeJSON(form)) postData('postulante', serializeJSON(form))
.then(response => { .then(response => {
if(response.status==200 || response.status==302){ if(response.status==200 || response.status==302){
......
curriculumsearch/src/main/webapp/jsp/postulante-form.jsp
...@@ -13,47 +13,74 @@ ...@@ -13,47 +13,74 @@
<body class="container"> <body class="container">
<h1>Curriculum</h1> <h1>Curriculum</h1>
<form name="postulante" method="post"> <form name="postulante" method="post" class="row g-3 needs-validation" novalidate>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="correo" class="form-label">Email address</label> <label for="correo" class="form-label">Email address</label>
<input type="email" name="correo" class="form-control " id="correo" > <input type="email" name="correo" class="form-control " id="correo" required>
<div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div> <div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="nombre" class="form-label">Nombre</label> <label for="nombre" class="form-label">Nombre</label>
<input type="text" name="nombre" class="form-control " id="nombre" > <input type="text" name="nombre" class="form-control" id="nombre" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="apellido" class="form-label">Apellido</label> <label for="apellido" class="form-label">Apellido</label>
<input type="text" name="apellido" class="form-control " id="apellido" > <input type="text" name="apellido" class="form-control " id="apellido" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-3"> <div class="mb-3 col-3">
<label for="ci" class="form-label">Cedula de identidad</label> <label for="ci" class="form-label">Cedula de identidad</label>
<input type="number" name="ci" class="form-control " id="ci" > <input type="number" name="ci" class="form-control " id="ci" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="ciudad" class="form-label">Ciudad</label> <label for="ciudad" class="form-label">Ciudad</label>
<input type="text" name="ciudad" class="form-control " id="ciudad" > <input type="text" name="ciudad" class="form-control " id="ciudad" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="telefono" class="form-label">Telefono</label> <label for="telefono" class="form-label">Telefono</label>
<input type="number" name="telefono" class="form-control " id="telefono" > <input type="number" name="telefono" class="form-control " id="telefono" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="fechaNacimiento" class="form-label">Fecha de nacimiento</label> <label for="fechaNacimiento" class="form-label">Fecha de nacimiento</label>
<input type="date" name="fechaNacimiento" class="form-control " id="fechaNacimiento" > <input type="date" min="1910-01-01" name="fechaNacimiento" class="form-control " id="fechaNacimiento" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="resumen" class="form-label">Resumen</label> <label for="resumen" class="form-label">Resumen</label>
<textarea class="form-control " name="resumen" id="resumen" > </textarea> <textarea class="form-control " name="resumen" id="resumen" required> </textarea>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="nivelIngles" class="form-label">Nivel de ingles</label> <label for="nivelIngles" class="form-label">Nivel de ingles</label>
<input type="number" class="form-control" name="nivelIngles" id="nivelIngles" > <input type="number" class="form-control" name="nivelIngles" id="nivelIngles" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="curriculum" class="form-label">Curriculum</label> <label for="curriculum" class="form-label">Curriculum</label>
...@@ -61,11 +88,17 @@ ...@@ -61,11 +88,17 @@
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="disponibilidad" class="form-label">Disponibilidad</label> <label for="disponibilidad" class="form-label">Disponibilidad</label>
<input type="text" class="form-control " name="disponibilidad" id="disponibilidad" > <input type="text" class="form-control " name="disponibilidad" id="disponibilidad" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="mb-3 col-5"> <div class="mb-3 col-5">
<label for="modalidad" class="form-label">Modalidad</label> <label for="modalidad" class="form-label">Modalidad</label>
<input type="text" class="form-control " name="modalidad" id="modalidad" > <input type="text" class="form-control " name="modalidad" id="modalidad" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
...@@ -91,15 +124,20 @@ ...@@ -91,15 +124,20 @@
<div class="modal-body"> <div class="modal-body">
<form name="experiencia-form"> <form name="experiencia-form">
<label for="institucion" class="form-label">Institucion</label> <label for="institucion" class="form-label">Institucion</label>
<input type="text" class="form-control " name="institucion" id="institucion" > <input type="text" class="form-control " name="institucion" id="institucion" required>
<label for="fechaDesde" class="form-label">FechaDesde</label> <label for="fechaDesde" class="form-label">FechaDesde</label>
<input type="date" class="form-control " name="fechaDesde" id="fechaDesde" > <input type="date" min="1960-01-01" class="form-control " name="fechaDesde" id="fechaDesde" required>
<label for="fechaHasta" class="form-label">Fecha Hasta</label> <label for="fechaHasta" class="form-label">Fecha Hasta</label>
<input type="date" class="form-control " name="fechaHasta" id="fechaHasta" > <input type="date" class="form-control " name="fechaHasta" id="fechaHasta" >
<label for="cargo" class="form-label">Cargo</label> <label for="cargo" class="form-label">Cargo</label>
<input type="text" class="form-control " name="cargo" id="cargo" > <input type="text" class="form-control " name="cargo" id="cargo" required>
<label for="refNombre" class="form-label">Referencia Nombre</label> <label for="refNombre" class="form-label">Referencia Nombre</label>
<input type="text" class="form-control " name="referencias" id="refNombre" > <input type="text" class="form-control " name="referencias" id="refNombre" >
<label class="form-label">Reconocimientos</label> <label class="form-label">Reconocimientos</label>
<div class="row mb-3"> <div class="row mb-3">
<div class="col"> <div class="col">
...@@ -129,7 +167,7 @@ ...@@ -129,7 +167,7 @@
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" onclick="agregarFieldExpierncia()" data-dismiss="modal">Agregar</button> <button id="agregar-exp" type="button" class="btn btn-primary" onclick="agregarFieldExpierncia()" data-dismiss="modal">Agregar</button>
</div> </div>
</div> </div>
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment