Commit ecedf95e by Joel Florentin

form postulante correcion de modal y selects

parent 78c12fed
...@@ -13,7 +13,18 @@ const postulaciones = []; ...@@ -13,7 +13,18 @@ const postulaciones = [];
var cont_referencias=0 ; var cont_referencias=0 ;
const referencias= []; const referencias= [];
form = document.querySelector("form");
const depSelect = document.querySelector("#departamentos");
console.log("saddsa", bootstrap)
const modalCargo = bootstrap.Modal.getOrCreateInstance(document.getElementById('cargoForm'))
const modalExperiencia = bootstrap.Modal.getOrCreateInstance(document.getElementById('experienciaForm'))
const modalTecnologia = bootstrap.Modal.getOrCreateInstance(document.getElementById('tecnologiaForm'))
const modalEstudio = bootstrap.Modal.getOrCreateInstance(document.getElementById('estudioForm'))
const modalReferencia = bootstrap.Modal.getOrCreateInstance(document.getElementById('referenciaForm'))
//variable ciudades esta declarada en el jsp
/*-----------------Definicion de funciones de poblacion de elementos y validaciones----------------------------------------*/
const formValidator = function () { const formValidator = function () {
'use strict' 'use strict'
...@@ -37,114 +48,66 @@ const formValidator = function () { ...@@ -37,114 +48,66 @@ const formValidator = function () {
}, false) }, false)
}) })
} }
function carg(elemento) { function fechasMaxMin(){
var element = document.getElementById('descripcion'); var today = new Date();
if(elemento == "otro"){ var dd = today.getDate()-1;
element.style.display='block'; var mm = today.getMonth() + 1; //January is 0!
}else{ var yyyy = today.getFullYear();
element.style.display='none';
}
}
function agregarFieldExpierncia(event){
//recoger del form
const pairs = {};
const formexp = document.querySelector("[name=experiencia-form]");
formexp.classList.add('was-validated')
const formData = new FormData(formexp);
let error=validarfecha(formData.get("fechaDesde"), formData.get("fechaHasta"))
let appendTo = "Hasta";
if (error) {
if(error.includes("desde")) appendTo = "Desde";
formexp.querySelector(".errorfecha"+appendTo)
formexp['fecha'+appendTo].setCustomValidity(error)
document.querySelector(".errorfecha"+appendTo).innerHTML = error;
console.log(error);
if (dd < 10) {
dd = '0' + dd;
} }
else{
formexp.fechaDesde.setCustomValidity('') if (mm < 10) {
formexp.fechaHasta.setCustomValidity('') mm = '0' + mm;
} }
const reconocimientos = [{},{},{}]; today = yyyy + '-' + mm + '-' + dd;
let pos_rec;
let returnFlag = false;
let requiredValues = ["institucion", "cargo", "fechaDesde"]
formData.forEach((value, key)=>{ let fechaDesdeEstudio = document.querySelector("#fechaDesdeEstudio");
if(requiredValues.includes(key) let fechaDesdeExperiencia = document.querySelector("#fechaDesdeExperiencia");
&& value==="" && returnFlag == false){ let fechaHastaEstudio = document.querySelector("#fechaHastaEstudio");
console.log(key, value) let fechaHastaExperiencia = document.querySelector("#fechaHastaExperiencia");
returnFlag = true; let fechaNacimiento = document.querySelector("#fechaNacimiento");
} let fechas = [fechaDesdeEstudio,fechaDesdeExperiencia,fechaHastaEstudio,fechaHastaExperiencia,fechaNacimiento]
}); fechas.forEach(fch => fch.addEventListener('keydown',()=>false))//no dejar cargar manualmente fechas
if(returnFlag===true){ fechaDesdeEstudio.setAttribute("max", today);
let message = "Rellene " fechaDesdeExperiencia.setAttribute("max", today);
for(let i=0;i<requiredValues.length;i++){ fechaNacimiento.setAttribute("max", today);
message+=", "+requiredValues[i];
}
message += " como minimo."
alert(message);
return;
}
for (const [name, value] of formData){ fechaDesdeExperiencia.addEventListener("change", ()=>{
pos_rec = name.split("-");//rec-nombre-index fechaHastaExperiencia.setAttribute("min", fechaDesdeExperiencia.value)
if (pos_rec.length > 1) { })
reconocimientos[pos_rec[2]][pos_rec[1]] = value fechaDesdeEstudio.addEventListener("change", ()=>{
} fechaHastaEstudio.setAttribute("min", fechaDesdeEstudio.value)
else{ })
pairs[name] = value }
}
function listarCiudades(depId){
const ciuAmostrar = ciudades.filter(c=>c.departamentoId==depId);
const ciudad = document.querySelector("select[name=ciudadId]");
const frag = document.createDocumentFragment();
for (const ciu of ciuAmostrar) {
const opt = document.createElement("option");
opt.value = ciu.id;
opt.innerHTML = ciu.nombre;
opt.setAttribute("data-departamentoId",ciu.departamentoId);
frag.appendChild(opt)
} }
pairs["reconocimientos"] = reconocimientos.filter(rec => rec.nombre); ciudad.replaceChildren(frag);
experiencias[cont_experiencia] = pairs;
formexp.reset();
formexp.classList.remove('was-validated')
//imprimir lista actualizada
const div = document.querySelector("#experiencias")
const div1 = document.createElement('div');
let content='';
for (let index = 0; index < experiencias.length; index++) {
const exp = experiencias[index];
if(exp==null) continue;
content += `
<div class="col border border-3" id="exp-${index}">
<h4><center>Experiencia</center></h4>
<label><b>Institucion:</b> ${exp.institucion}</label><br>
<label><b>Fecha Inicio:</b> ${exp.fechaDesde}</label><br>
<label><b>Fecha Fin:</b> ${exp.fechaHasta}</label><br>
<label><b>Referencia:</b> ${exp.nombreReferencia}</label><br>
<label><b>Telefono de la referencia:</b> ${exp.telefonoReferencia}</label><br>
<label><b>Cargo:</b> ${exp.cargo}</label><br>
<label><b>Motivo de salida:</b> ${exp.motivoSalida}</label><br>
<button type="button" class="btn btn-primary" onclick="eliminarExperiencia(event)"> <span class="glyphicon glyphicon-trash"></span>Eliminar</button>
</div>
`
}
//content += "</ul>"
div.innerHTML = content
//div.innerHTML = '';
//div.appendChild(div1);
cont_experiencia++;
} }
function validarfecha(fechaDesde, fechaHasta){ function validarfecha(fechaDesde, fechaHasta){
let fechadehoy= new Date().toISOString().slice(0,10); let fechadehoy= new Date().toISOString().slice(0,10);
if(fechaDesde>fechadehoy ){ if(fechaDesde>fechadehoy ){
return "la fecha desde no puede ser mayor a la fecha actual" ; return "la fecha desde no puede ser mayor a la fecha actual" ;
} }
if(fechaHasta =! null && fechaHasta>fechadehoy){
return "la fecha hasta no puede ser mayor a la fecha actual" ;
}
if(fechaHasta =! null && fechaDesde>fechaHasta){ if(fechaHasta =! null && fechaDesde>fechaHasta){
return "la fecha desde no puede ser mayor a la fecha hasta"; return "la fecha desde no puede ser mayor a la fecha hasta";
...@@ -152,7 +115,7 @@ function validarfecha(fechaDesde, fechaHasta){ ...@@ -152,7 +115,7 @@ function validarfecha(fechaDesde, fechaHasta){
return false return false
} }
/*--------------------------------------------------------------------*/ /*-----------------Tecnologia----------------------------------------*/
function agregarFieldTecnologia(){ function agregarFieldTecnologia(){
//recoger del form //recoger del form
const pairs = {}; const pairs = {};
...@@ -217,146 +180,135 @@ function agregarFieldTecnologia(){ ...@@ -217,146 +180,135 @@ function agregarFieldTecnologia(){
cont_tecnologia++; cont_tecnologia++;
document.querySelector("#no-valid-tecno").style.display = "none"; document.querySelector("#no-valid-tecno").style.display = "none";
} }
/*--------------------------------------------------------------------*/
function eliminarExperiencia(event) {
//eliminar del array
experiencias[event.target.parentElement.id.split("-")[1]]=null
//eliminar en html
event.target.parentElement.remove()
}
/*----------------------------------------------------------------- */
function eliminarTecnologia(event) { function eliminarTecnologia(event) {
//eliminar del array //eliminar del array
tecnologias[event.target.parentElement.id.split("-")[1]]=null tecnologias[event.target.parentElement.id.split("-")[1]]=null
//eliminar en html //eliminar en html
event.target.parentElement.remove() event.target.parentElement.remove()
} }
/*----------------------------------------------------------------- */
function serializeJSON (form) {
// Create a new FormData object
const formData = new FormData(form);
if(formData.get('fechaNacimiento')>=new Date().toISOString().slice(0,10)){ /*----------------Experiencia-----------------------------------------*/
form['fechaNacimiento'].setCustomValidity('Fecha de nacimiento debe ser menor que actual') function agregarFieldExpierncia(event){
noValidateFlag = true; //recoger del form
return; const pairs = {};
} const formexp = document.querySelector("[name=experiencia-form]");
else{ formexp.classList.add('was-validated')
form['fechaNacimiento'].setCustomValidity('') const formData = new FormData(formexp);
} let error=validarfecha(formData.get("fechaDesde"), formData.get("fechaHasta"))
let appendTo = "Hasta";
if (error) {
if(error.includes("desde")) appendTo = "Desde";
// Create an object to hold the name/value pairs
const pairs = {};
// Add each name/value pair to the object formexp['fecha'+appendTo].setCustomValidity(error)
for (const [name, value] of formData) { formexp.querySelector(".errorFecha"+appendTo).innerHTML = error;
pairs[name] = value console.log(error);
}
pairs["experiencias"] = experiencias.filter(exp => exp)//eliminacion de nulos
pairs["estudios"] = estudios.filter(est => est)//eliminacion de nulos
pairs["tecnologias"] = tecnologias.filter(tec => tec)//eliminacion de nulos
pairs["postulaciones"] = postulaciones.filter(car => car)//eliminacion de nulos
pairs["referencias"] = referencias.filter(tec => tec)
if(pairs["postulaciones"].length<1){
document.querySelector("#no-valid-cargo").style.display = "block";
noValidateFlag = true;
}else{
document.querySelector("#no-valid-cargo").style.display = "none";
}
console.log(pairs["tecnologias"])
if(pairs["tecnologias"].length<1){
document.querySelector("#no-valid-tecno").style.display = "block";
noValidateFlag = true;
}else{
document.querySelector("#no-valid-tecno").style.display = "none";
} }
if(noValidateFlag){ else{
return; formexp.fechaDesde.setCustomValidity('')
formexp.fechaHasta.setCustomValidity('')
} }
noValidateFlag = false
// Return the JSON string const reconocimientos = [{},{},{}];
return JSON.stringify(pairs, null, 2); let pos_rec;
} let returnFlag = false;
function obtenerCV(){ let requiredValues = ["institucion", "cargo", "fechaDesde"]
let input = document.querySelector('#cvFile')
return input.files[0];
} formData.forEach((value, key)=>{
if(requiredValues.includes(key)
&& value==="" && returnFlag == false){
console.log(key, value)
returnFlag = true;
}
});
async function postData(url = '', data = {}) { if(returnFlag===true){
var token = document.querySelector("meta[name='_csrf']").content; let message = "Rellene "
var headerxs = document.querySelector("meta[name='_csrf_header']").content; for(let i=0;i<requiredValues.length;i++){
// Default options are marked with * message+=", "+requiredValues[i];
let senddata = {
method: 'POST', // *GET, POST, PUT, DELETE, etc.
mode: 'cors', // no-cors, *cors, same-origin
cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
credentials: 'same-origin', // include, *same-origin, omit
headers: {
//'Content-Type': undefined//'application/json',
// 'Content-Type': 'application/x-www-form-urlencoded',
},
redirect: 'follow', // manual, *follow, error
referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
body: data // body data type must match "Content-Type" header
} }
senddata["headers"][headerxs] = token; message += " como minimo."
let response = null //alert(message);
if(!noValidateFlag){ return;
response = await fetch(url, senddata);
} }
return response; // parses JSON response into native JavaScript objects
}
function formatearJsonWithFile(json, file){ for (const [name, value] of formData){
formData = new FormData(); pos_rec = name.split("-");//rec-nombre-index
if (pos_rec.length > 1) {
formData.append("file", file); reconocimientos[pos_rec[2]][pos_rec[1]] = value
formData.append('postulante', new Blob([json], {
type: "application/json"
}));
return formData
}
formValidator()
form = document.querySelector("form");
form.addEventListener("submit",(evt)=>{
// if (!form.checkValidity()) {
// evt.preventDefault()
// evt.stopPropagation()
// }
// form.classList.add('was-validated')
evt.preventDefault();
let formSerialized = serializeJSON(form);
let fileCV = obtenerCV();
if(!noValidateFlag){
postData('work-with-us', formatearJsonWithFile(formSerialized,fileCV))
.then(response => {
if(response.status==200 || response.status==302){
location.replace(response.url);
}else{
console.log(response.text().then(value => console.log(value)))
} }
}); else{
pairs[name] = value
} }
noValidateFlag = false
} );
}
pairs["reconocimientos"] = reconocimientos.filter(rec => rec.nombre);
experiencias[cont_experiencia] = pairs;
formexp.reset();
formexp.classList.remove('was-validated')
//imprimir lista actualizada
const div = document.querySelector("#experiencias")
const div1 = document.createElement('div');
//Metodos para Estudios let content='';
for (let index = 0; index < experiencias.length; index++) {
const exp = experiencias[index];
if(exp==null) continue;
content += `
<div class="col border border-3" id="exp-${index}">
<h4><center>Experiencia</center></h4>
<label><b>Institucion:</b> ${exp.institucion}</label><br>
<label><b>Fecha Inicio:</b> ${exp.fechaDesde}</label><br>
<label><b>Fecha Fin:</b> ${exp.fechaHasta}</label><br>
<label><b>Referencia:</b> ${exp.nombreReferencia}</label><br>
<label><b>Telefono de la referencia:</b> ${exp.telefonoReferencia}</label><br>
<label><b>Cargo:</b> ${exp.cargo}</label><br>
<label><b>Motivo de salida:</b> ${exp.motivoSalida}</label><br>
<button type="button" class="btn btn-primary" onclick="eliminarExperiencia(event)"> <span class="glyphicon glyphicon-trash"></span>Eliminar</button>
</div>
`
}
//content += "</ul>"
div.innerHTML = content
//div.innerHTML = '';
//div.appendChild(div1);
cont_experiencia++;
modalExperiencia.hide()
}
function eliminarExperiencia(event) {
//eliminar del array
experiencias[event.target.parentElement.id.split("-")[1]]=null
//eliminar en html
event.target.parentElement.remove()
}
/*---------------Estudios---------------------------*/
function agregarFieldEstudio(){ function agregarFieldEstudio(){
//recoger del form //recoger del form
let pairs = {}; let pairs = {};
const formest = document.querySelector("[name=estudio-form]"); const formest = document.querySelector("[name=estudio-form]");
const formData = new FormData(formest); const formData = new FormData(formest);
formest.classList.add('was-validated')
let error=validarfecha(formData.get("fechaDesde"), formData.get("fechaHasta"))
let appendTo = "Hasta";
if (error) {
if(error.includes("desde")) appendTo = "Desde";
formest['fecha'+appendTo].setCustomValidity(error)
formest.querySelector(".errorFecha"+appendTo).innerHTML = error;
console.log(error);
}
else{
formest.fechaDesde.setCustomValidity('')
formest.fechaHasta.setCustomValidity('')
}
//Validacion //Validacion
let returnFlag = false; let returnFlag = false;
...@@ -377,7 +329,7 @@ function agregarFieldEstudio(){ ...@@ -377,7 +329,7 @@ function agregarFieldEstudio(){
message+=", "+requiredValues[i]; message+=", "+requiredValues[i];
} }
message += " como minimo." message += " como minimo."
alert(message); //alert(message);
return; return;
} }
...@@ -430,20 +382,17 @@ function agregarFieldEstudio(){ ...@@ -430,20 +382,17 @@ function agregarFieldEstudio(){
//div.innerHTML = ''; //div.innerHTML = '';
//div.appendChild(div1); //div.appendChild(div1);
cont_estudios++; cont_estudios++;
formest.classList.remove('was-validated')
modalEstudio.hide()
} }
function eliminarEstudio(event) { function eliminarEstudio(event) {
//eliminar del array //eliminar del array
estudios[event.target.parentElement.id.split("-")[1]]=null estudios[event.target.parentElement.id.split("-")[1]]=null
//eliminar en html //eliminar en html
event.target.parentElement.remove() event.target.parentElement.remove()
} }
/*--------------------------------------------------------------------*/ /*------------Cargos----------------------------------------*/
function agregarFieldCargo(){ function agregarFieldCargo(){
//recoger del form //recoger del form
const pairs = {}; const pairs = {};
...@@ -513,49 +462,21 @@ function agregarFieldCargo(){ ...@@ -513,49 +462,21 @@ function agregarFieldCargo(){
//div.appendChild(div1); //div.appendChild(div1);
cont_cargo++; cont_cargo++;
document.querySelector("#no-valid-cargo").style.display = "none"; document.querySelector("#no-valid-cargo").style.display = "none";
modalCargo.hide()
} }
/*---------------------------------------------------------------------------------------------------*/
function eliminarCargoPostulante(event) { function eliminarCargoPostulante(event) {
//eliminar del array //eliminar del array
postulaciones[event.target.parentElement.id.split("-")[1]]=null postulaciones[event.target.parentElement.id.split("-")[1]]=null
//eliminar en html //eliminar en html
event.target.parentElement.remove() event.target.parentElement.remove()
} }
/*--------------------------------------------------------------------*/
//evento para cambio de ciudad segun departamento
const depSelect = document.querySelector("#departamentos");
depSelect.addEventListener("change",evt => listarCiudades(evt.target.value))
listarCiudades(depSelect.value);
//variable ciudades esta declarada en el jsp
/**
* Listar todas las ciudades en el select de ciudades
* @param {*} depId
*/
function listarCiudades(depId){
const ciuAmostrar = ciudades.filter(c=>c.departamentoId==depId);
const ciudad = document.querySelector("select[name=ciudadId]");
const frag = document.createDocumentFragment();
for (const ciu of ciuAmostrar) {
const opt = document.createElement("option");
opt.value = ciu.id;
opt.innerHTML = ciu.nombre;
opt.setAttribute("data-departamentoId",ciu.departamentoId);
frag.appendChild(opt)
}
ciudad.replaceChildren(frag);
}
/*--------------Referencias----------------------------- */
function agregarFieldReferencia(event){ function agregarFieldReferencia(event){
//recoger del form //recoger del form
const pairs = {}; const pairs = {};
const formexp = document.querySelector("[name=referencia-form]"); const formexp = document.querySelector("[name=referencia-form]");
formexp.classList.add('was-validated')
const formData = new FormData(formexp); const formData = new FormData(formexp);
const referenciaPersonal = [{},{},{}]; const referenciaPersonal = [{},{},{}];
let pos_rec; let pos_rec;
...@@ -577,7 +498,7 @@ function agregarFieldReferencia(event){ ...@@ -577,7 +498,7 @@ function agregarFieldReferencia(event){
message+=", "+requiredValues[i]; message+=", "+requiredValues[i];
} }
message += " como minimo." message += " como minimo."
alert(message); //alert(message);
return; return;
} }
...@@ -617,71 +538,147 @@ function agregarFieldReferencia(event){ ...@@ -617,71 +538,147 @@ function agregarFieldReferencia(event){
//div.innerHTML = ''; //div.innerHTML = '';
//div.appendChild(div1); //div.appendChild(div1);
cont_referencias++; cont_referencias++;
formexp.classList.remove('was-validated')
modalExperiencia.hide()
} }
/*----------------------------------------------------------------- */
function eliminarReferencia(event) { function eliminarReferencia(event) {
//eliminar del array //eliminar del array
referencias[event.target.parentElement.id.split("-")[1]]=null referencias[event.target.parentElement.id.split("-")[1]]=null
//eliminar en html //eliminar en html
event.target.parentElement.remove() event.target.parentElement.remove()
} }
/*----------------------------------------------------------------- */ /*--------------Form submit----------------------------- */
function serializeJSON (form) {
// Create a new FormData object
const formData = new FormData(form);
/*--------------------------------------------------------------------------------------------------------- */
// $(function(){ if(formData.get('fechaNacimiento')>=new Date().toISOString().slice(0,10)){
// $("#wizard").steps({ form['fechaNacimiento'].setCustomValidity('Fecha de nacimiento debe ser menor que actual')
// headerTag: "h4", noValidateFlag = true;
// bodyTag: "section", return;
// transitionEffect: "fade", }
// enableAllSteps: true, else{
// transitionEffectSpeed: 500, form['fechaNacimiento'].setCustomValidity('')
// onStepChanging: function (event, currentIndex, newIndex) { }
// if ( newIndex === 1 ) {
// $('.steps ul').addClass('step-2');
// } else { // Create an object to hold the name/value pairs
// $('.steps ul').removeClass('step-2'); const pairs = {};
// }
// if ( newIndex === 2 ) { // Add each name/value pair to the object
// $('.steps ul').addClass('step-3'); for (const [name, value] of formData) {
// } else { pairs[name] = value
// $('.steps ul').removeClass('step-3'); }
// } pairs["experiencias"] = experiencias.filter(exp => exp)//eliminacion de nulos
// pairs["estudios"] = estudios.filter(est => est)//eliminacion de nulos
// if ( newIndex === 3 ) { pairs["tecnologias"] = tecnologias.filter(tec => tec)//eliminacion de nulos
// $('.steps ul').addClass('step-4'); pairs["postulaciones"] = postulaciones.filter(car => car)//eliminacion de nulos
// $('.actions ul').addClass('step-last'); pairs["referencias"] = referencias.filter(tec => tec)
// } else { if(pairs["postulaciones"].length<1){
// $('.steps ul').removeClass('step-4'); document.querySelector("#no-valid-cargo").style.display = "block";
// $('.actions ul').removeClass('step-last'); noValidateFlag = true;
// } }else{
// return true; document.querySelector("#no-valid-cargo").style.display = "none";
// }, }
// labels: { console.log(pairs["tecnologias"])
// finish: "Order again", if(pairs["tecnologias"].length<1){
// next: "Next", document.querySelector("#no-valid-tecno").style.display = "block";
// previous: "Previous" noValidateFlag = true;
// } }else{
// }); document.querySelector("#no-valid-tecno").style.display = "none";
// // Custom Steps Jquery Steps }
// $('.wizard > .steps li a').click(function(){ if(noValidateFlag){
// $(this).parent().addClass('checked'); return;
// $(this).parent().prevAll().addClass('checked'); }
// $(this).parent().nextAll().removeClass('checked'); noValidateFlag = false
// });
// // Custom Button Jquery Steps // Return the JSON string
// $('.forward').click(function(){ return JSON.stringify(pairs, null, 2);
// $("#wizard").steps('next'); }
// })
// $('.backward').click(function(){ function obtenerCV(){
// $("#wizard").steps('previous'); let input = document.querySelector('#cvFile')
// }) return input.files[0];
// // Checkbox
// $('.checkbox-circle label').click(function(){ }
// $('.checkbox-circle label').removeClass('active');
// $(this).addClass('active'); async function postData(url = '', data = {}) {
// }) var token = document.querySelector("meta[name='_csrf']").content;
// }) var headerxs = document.querySelector("meta[name='_csrf_header']").content;
/*--------------------------------------------------------------------------------------------------------- */ // Default options are marked with *
\ No newline at end of file let senddata = {
method: 'POST', // *GET, POST, PUT, DELETE, etc.
mode: 'cors', // no-cors, *cors, same-origin
cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
credentials: 'same-origin', // include, *same-origin, omit
headers: {
//'Content-Type': undefined//'application/json',
// 'Content-Type': 'application/x-www-form-urlencoded',
},
redirect: 'follow', // manual, *follow, error
referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
body: data // body data type must match "Content-Type" header
}
senddata["headers"][headerxs] = token;
let response = null
if(!noValidateFlag){
response = await fetch(url, senddata);
}
return response; // parses JSON response into native JavaScript objects
}
function formatearJsonWithFile(json, file){
formData = new FormData();
formData.append("file", file);
formData.append('postulante', new Blob([json], {
type: "application/json"
}));
return formData
}
/*--------------Llamar funciones y agregar listeners----------------------------- */
formValidator();
fechasMaxMin();
listarCiudades(depSelect.value);
form.addEventListener("submit",(evt)=>{
// if (!form.checkValidity()) {
// evt.preventDefault()
// evt.stopPropagation()
// }
// form.classList.add('was-validated')
evt.preventDefault();
let formSerialized = serializeJSON(form);
let fileCV = obtenerCV();
if(!noValidateFlag){
postData('work-with-us', formatearJsonWithFile(formSerialized,fileCV))
.then(response => {
if(response.status==200 || response.status==302){
location.replace(response.url);
}else{
errorDispatcher(response.text().then(value => console.log(value)));
}
},(reason)=>{
errorDispatcher(reason);
});
}
noValidateFlag = false
} );
function errorDispatcher(reason){
const errorSection = document.querySelector("#errorSection")
errorSection.innerHTML = `
<div class="alert alert-warning alert-dismissible fade show " role="alert">
<strong>Ha ocurrido un error</strong>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>`;
console.log(reason)
errorSection.focus()
}
//evento para cambio de ciudad segun departamento
depSelect.addEventListener("change",evt => listarCiudades(evt.target.value))
...@@ -15,6 +15,11 @@ ...@@ -15,6 +15,11 @@
</head> </head>
<body class="container"> <body class="container">
<div class="row">
<div id="errorSection" class="col" tabindex="-1">
</div>
</div>
<form name="postulante" method="post" class="needs-validation" novalidate> <form name="postulante" method="post" class="needs-validation" novalidate>
<div class="container mt-3"> <div class="container mt-3">
<div class="card p-3 text-center"> <div class="card p-3 text-center">
...@@ -23,38 +28,25 @@ ...@@ -23,38 +28,25 @@
</div> </div>
<h4>Curriculum</h4> <h4>Curriculum</h4>
<div class="row"> <div class="row">
<div class="about-inputs mb-3 col-md-12 center">
<label for="resumen" class="form-label">Resumen</label>
<textarea class="form-control center " name="resumen" id="resumen" required > </textarea>
<div class="valid-feedback">
Luce Bien!
</div>
</div>
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<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" required> <input type="text" name="nombre" class="form-control " id="nombre" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<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" required> <input type="text" name="apellido" class="form-control " id="apellido" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<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" required> <input type="email" name="correo" class="form-control " id="correo" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
...@@ -68,7 +60,7 @@ ...@@ -68,7 +60,7 @@
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<label for="tipoDocumento" class="form-label"> Tipo de documento</label> <label for="tipoDocumento" class="form-label"> Tipo de documento</label>
<select name="tipoDocumento" id="tipoDocumento" class="bg-light" required onchange='carg(this.value);'> <select name="tipoDocumento" id="tipoDocumento" class="bg-light" required>
<option value='CI' selected>C.I</option> <option value='CI' selected>C.I</option>
<option value='PAS'>Pasport</option> <option value='PAS'>Pasport</option>
<option value='Otro'>Otro</option> <option value='Otro'>Otro</option>
...@@ -78,9 +70,7 @@ ...@@ -78,9 +70,7 @@
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<label for="nroDocument" class="form-label">Numero de Documento</label> <label for="nroDocument" class="form-label">Numero de Documento</label>
<input type="number" name="nroDocument" class="form-control " id="nroDocument" required> <input type="number" name="nroDocument" class="form-control " id="nroDocument" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
...@@ -103,21 +93,24 @@ ...@@ -103,21 +93,24 @@
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<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" required> <input type="number" name="telefono" class="form-control " id="telefono" required>
<div class="valid-feedback">
Luce Bien!
</div>
</div> </div>
<div class="inputs mb-3 col-md-6"> <div class="inputs mb-3 col-md-6">
<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" required> <input type="date" name="fechaNacimiento" class="form-control " id="fechaNacimiento" required>
<div class="valid-feedback">
Luce Bien!
</div> </div>
<div class="about-inputs mb-3 col-md-12 center">
<label for="resumen" class="form-label">Resumen</label>
<textarea class="form-control center " name="resumen" id="resumen" required > </textarea>
</div> </div>
<div class="inputs mb-3 col-md-4"> <label for="nivelIngles" class="form-label"> Nivel de ingles</label> <div class="inputs mb-3 col-md-3"> <label for="nivelIngles" class="form-label"> Nivel de ingles</label>
<select name="nivelIngles" id="nivelIngles" class="content-select"> <select name="nivelIngles" id="nivelIngles" class="content-select">
<option value="1" selected>Ingles muy basico</option> <option value="1" selected>Ingles muy basico</option>
<option value="2" >Comprendo algunas cosas y puedo leer con la ayuda del traductor</option> <option value="2" >Comprendo algunas cosas y puedo leer con la ayuda del traductor</option>
...@@ -127,7 +120,7 @@ ...@@ -127,7 +120,7 @@
</select> </select>
</div> </div>
<div class="inputs mb-3 col-md-4"> <div class="inputs mb-3 col-md-3">
<label for="disponibilidad" class="form-label"> Disponibilidad</label> <label for="disponibilidad" class="form-label"> Disponibilidad</label>
<select name="disponibilidad" id="disponibilidad" class="content-select"> <select name="disponibilidad" id="disponibilidad" class="content-select">
<c:forEach items="${disponibilidades}" var="disponibilidad"> <c:forEach items="${disponibilidades}" var="disponibilidad">
...@@ -136,7 +129,7 @@ ...@@ -136,7 +129,7 @@
</select> </div> </select> </div>
<div class="inputs mb-3 col-md-4"> <div class="inputs mb-3 col-md-3">
<label for="estadoCivil" class="form-label"> Estado Civil</label> <label for="estadoCivil" class="form-label"> Estado Civil</label>
<select name="estadoCivil" id="estadoCivil" class="content-select"> <select name="estadoCivil" id="estadoCivil" class="content-select">
<c:forEach items="${estadosCiviles}" var="estadoCivil"> <c:forEach items="${estadosCiviles}" var="estadoCivil">
...@@ -144,28 +137,28 @@ ...@@ -144,28 +137,28 @@
</c:forEach> </c:forEach>
</select> </select>
</div> </div>
<div class="inputs mb-3 col-md-4"> <div class="inputs mb-3 col-md-3">
<label for="formFile" class="form-label">Cargar cv</label> <label for="formFile" class="form-label">Cargar cv</label>
<input class="form-control" type="file" id="cvFile"> <input class="form-control" type="file" id="cvFile">
</div> </div>
<!-- Button Agregar Cargo al que postulas --> <!-- Button Agregar Cargo al que postulas -->
<button type="button" class="btn btn-primary"><span class="add-experience" class="btn btn-primary" data-toggle="modal" data-target="#cargoForm"><i class="fa fa-plus"></i>&nbsp;Agregar Cargo al que postulas</span></button><br> <button type="button" class="btn btn-primary"><span class="add-experience" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#cargoForm"><i class="fa fa-plus"></i>&nbsp;Agregar Cargo al que postulas</span></button><br>
<p id="no-valid-cargo" style="display: none; color: darkred; border: solid 1px darkred; border-radius: 25px; width: 75%" class="m-3"> <p id="no-valid-cargo" style="display: none; color: darkred; border: solid 1px darkred; border-radius: 25px; width: 75%" class="m-3">
*Agrega por lo menos un cargo *Agrega por lo menos un cargo
</p> </p>
<div class="mt-3 gap-2 row row-cols-4" style="display: flex;" id="cargos"></div> <div class="mt-3 gap-2 row row-cols-4" style="display: flex;" id="cargos"></div>
<!-- Button Agregar Experiencia --> <!-- Button Agregar Experiencia -->
<button type="button" class="btn btn-primary"><span class="add-experience" data-toggle="modal" data-target="#experienciaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Experiencia</span></button><br> <button type="button" class="btn btn-primary mt-2"><span class="add-experience" data-bs-toggle="modal" data-bs-target="#experienciaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Experiencia</span></button><br>
<div class="mt-3 gap-2 row row-cols-4" id="experiencias"></div> <div class="mt-3 gap-2 row row-cols-4" id="experiencias"></div>
<!-- Button Agregar Estudio --> <!-- Button Agregar Estudio -->
<button type="button" class="btn btn-primary"><span class="add-experience" data-toggle="modal" data-target="#estudioForm"><i class="fa fa-plus"></i>&nbsp;Agregar Estudio</span></button><br> <button type="button" class="btn btn-primary mt-2"><span class="add-experience" data-bs-toggle="modal" data-bs-target="#estudioForm"><i class="fa fa-plus"></i>&nbsp;Agregar Estudio</span></button><br>
<div class="mt-3 gap-2 row row-cols-4" id="estudios"></div> <div class="mt-3 gap-2 row row-cols-4" id="estudios"></div>
<!-- Button Agregar Tecnologia --> <!-- Button Agregar Tecnologia -->
<button type="button" class="btn btn-primary"><span class="add-experience" data-toggle="modal" data-target="#tecnologiaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Tecnologia</span></button><br> <button type="button" class="btn btn-primary mt-2"><span class="add-experience" data-bs-toggle="modal" data-bs-target="#tecnologiaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Tecnologia</span></button><br>
<p id="no-valid-tecno" style="display: none; color: darkred; border: solid 1px darkred; border-radius: 25px; width: 75%" class="m-3"> <p id="no-valid-tecno" style="display: none; color: darkred; border: solid 1px darkred; border-radius: 25px; width: 75%" class="m-3">
*Agrega por lo menos una tecnologia *Agrega por lo menos una tecnologia
...@@ -174,13 +167,13 @@ ...@@ -174,13 +167,13 @@
</div> </div>
<!-- Button Agregar Refencia personal --> <!-- Button Agregar Refencia personal -->
<button type="button" class="btn btn-primary"><span class="add-experience" data-toggle="modal" data-target="#referenciaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Referencia Personal</span></button><br> <button type="button" class="btn btn-primary mt-2"><span class="add-experience" data-bs-toggle="modal" data-bs-target="#referenciaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Referencia Personal</span></button><br>
<div class="mt-3 gap-2 row row-cols-4" id="referencia"></div> <div class="mt-3 gap-2 row row-cols-4" id="referencia"></div>
<div class="mt-3 gap-2 d-flex justify-content-end"> <div class="mt-3 gap-2 d-flex justify-content-end">
<a class="px-3 btn btn-sm btn-outline-primary" href="/postulante">Cancelar</a> <a class="px-3 btn btn-sm btn-outline-primary" href="/work-with-us">Cancelar</a>
<button class="px-3 btn btn-sm btn-primary" type="submit">Guardar</button> <button class="px-3 btn btn-sm btn-primary" type="submit">Guardar</button>
</div> </div>
</div> </div>
...@@ -188,12 +181,12 @@ ...@@ -188,12 +181,12 @@
</div> </div>
</form> </form>
<!---------------------------------------Modal de Cargos disponibles----------------------------------------------------------------> <!---------------------------------------Modal de Cargos disponibles---------------------------------------------------------------->
<div class="modal fade" id="cargoForm" tabindex="-2" role="dialog" aria-labelledby="cargoForm" aria-hidden="true"> <div class="modal fade" id="cargoForm" tabindex="-1" role="dialog" aria-labelledby="cargoForm" aria-hidden="true">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel" >CargosDisponibles</h5> <h5 class="modal-title" id="exampleModalLabel" >CargosDisponibles</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
...@@ -202,7 +195,7 @@ ...@@ -202,7 +195,7 @@
<label for="cargo-nombre" class="form-label">Cargo</label> <label for="cargo-nombre" class="form-label">Cargo</label>
<div class="input-group mb-3"> <div class="input-group mb-3">
<select class="form-select" name="cargo-id" aria-label="Default select example" required> <select class="form-select" name="cargo-id" aria-label="Default select example" required>
<option value="-1" selected>Open this select menu</option>
<c:forEach items="${CargosDisponibles}" var="convocatoria"> <c:forEach items="${CargosDisponibles}" var="convocatoria">
<option value="${convocatoria.getId()}">${convocatoria.getCargo().getNombre()}</option> <option value="${convocatoria.getId()}">${convocatoria.getCargo().getNombre()}</option>
</c:forEach>> </c:forEach>>
...@@ -211,8 +204,8 @@ ...@@ -211,8 +204,8 @@
</form> </form>
</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-bs-dismiss="modal">Cerrar</button>
<button type="button" class="btn btn-primary" onclick="agregarFieldCargo()" data-dismiss="modal">Agregar</button> <button type="button" class="btn btn-primary" onclick="agregarFieldCargo()">Agregar</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -225,7 +218,7 @@ ...@@ -225,7 +218,7 @@
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Experiencia</h5> <h5 class="modal-title" id="exampleModalLabel">Experiencia</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
...@@ -288,19 +281,19 @@ ...@@ -288,19 +281,19 @@
</form> </form>
</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-bs-dismiss="modal">Cerrar</button>
<button id="agregar-exp" 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()">Agregar</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!---------------------------------------------------------------------------------------> <!--------------------------------------------------------------------------------------->
<div class="modal fade" id="tecnologiaForm" tabindex="-2" role="dialog" aria-labelledby="tecnologiaForm" aria-hidden="true"> <div class="modal fade" id="tecnologiaForm" tabindex="-1" role="dialog" aria-labelledby="tecnologiaForm" aria-hidden="true">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel" >tecnologia</h5> <h5 class="modal-title" id="exampleModalLabel" >tecnologia</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
...@@ -309,7 +302,7 @@ ...@@ -309,7 +302,7 @@
<label for="tecnologia-nombre" class="form-label">Tecnologia</label> <label for="tecnologia-nombre" class="form-label">Tecnologia</label>
<div class="input-group mb-3"> <div class="input-group mb-3">
<select class="form-select" name="tecnologia-id" aria-label="Default select example" required> <select class="form-select" name="tecnologia-id" aria-label="Default select example" required>
<option value="-1" selected>Open this select menu</option>
<c:forEach items="${tecnologias}" var="tecnologia"> <c:forEach items="${tecnologias}" var="tecnologia">
<option value="${tecnologia.id}">${tecnologia.nombre}</option> <option value="${tecnologia.id}">${tecnologia.nombre}</option>
</c:forEach> </c:forEach>
...@@ -323,8 +316,8 @@ ...@@ -323,8 +316,8 @@
</form> </form>
</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-bs-dismiss="modal">Cerrar</button>
<button type="button" class="btn btn-primary" onclick="agregarFieldTecnologia()" data-dismiss="modal">Agregar</button> <button type="button" class="btn btn-primary" onclick="agregarFieldTecnologia()">Agregar</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -338,7 +331,7 @@ ...@@ -338,7 +331,7 @@
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Estudios</h5> <h5 class="modal-title" id="exampleModalLabel">Estudios</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
...@@ -349,7 +342,7 @@ ...@@ -349,7 +342,7 @@
<div class="form-group"> <div class="form-group">
<label for="tipoDeEstudio">Tipo de Estudio</label> <label for="tipoDeEstudio">Tipo de Estudio</label>
<select name="tipoDeEstudio" id="tipoDeEstudio" required> <select name="tipoDeEstudio" id="tipoDeEstudio" required>
<option value="-1" selected disabled hidden>Seleccionar</option>
<c:forEach items="${tiposDeEstudio}" var="tipo"> <c:forEach items="${tiposDeEstudio}" var="tipo">
<option value="${tipo}">${tipo.name}</option> <option value="${tipo}">${tipo.name}</option>
</c:forEach> </c:forEach>
...@@ -368,7 +361,7 @@ ...@@ -368,7 +361,7 @@
<div class="form-group"> <div class="form-group">
<label for="estado">Estado</label> <label for="estado">Estado</label>
<select name="estado" id="estado" required> <select name="estado" id="estado" required>
<option value="-1" selected disabled hidden>Seleccionar</option>
<c:forEach items="${estadosEstudio}" var="estado"> <c:forEach items="${estadosEstudio}" var="estado">
<option value="${estado}">${estado.name}</option> <option value="${estado}">${estado.name}</option>
</c:forEach> </c:forEach>
...@@ -377,18 +370,24 @@ ...@@ -377,18 +370,24 @@
<div class="form-group"> <div class="form-group">
<label for="fechaDesdeEstudio" class="form-label">Fecha Desde</label> <label for="fechaDesdeEstudio" class="form-label">Fecha Desde</label>
<input type="date" class="form-control " name="fechaDesde" id="fechaDesdeEstudio" required> <input type="date" class="form-control " name="fechaDesde" id="fechaDesdeEstudio" required>
<div class="invalid-feedback errorFechaDesde">
</div>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="fechaHastaEstudio" class="form-label">Fecha Hasta</label> <label for="fechaHastaEstudio" class="form-label">Fecha Hasta</label>
<input type="date" class="form-control " name="fechaHasta" id="fechaHastaEstudio" > <input type="date" class="form-control " name="fechaHasta" id="fechaHastaEstudio" >
<div class="invalid-feedback errorFechaHasta">
</div>
</div> </div>
</form> </form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
<button type="button" class="btn btn-primary" onclick="agregarFieldEstudio()" data-dismiss="modal">Agregar</button> <button type="button" class="btn btn-primary" onclick="agregarFieldEstudio()">Agregar</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -401,7 +400,7 @@ ...@@ -401,7 +400,7 @@
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Referencias Personales</h5> <h5 class="modal-title" id="exampleModalLabel">Referencias Personales</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
...@@ -427,8 +426,8 @@ ...@@ -427,8 +426,8 @@
</form> </form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cerrar</button>
<button type="button" class="btn btn-primary" onclick="agregarFieldReferencia()" data-dismiss="modal">Agregar</button> <button type="button" class="btn btn-primary" onclick="agregarFieldReferencia()">Agregar</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -436,48 +435,10 @@ ...@@ -436,48 +435,10 @@
<!-- Optional JavaScript; choose one of the two! --> <!-- Optional JavaScript; choose one of the two! -->
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
<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://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" 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> <script>
var ciudades = ${ciudades}; var ciudades = ${ciudades};
(function(){
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd;
}
if (mm < 10) {
mm = '0' + mm;
}
today = yyyy + '-' + mm + '-' + dd;
let fechaDesdeEstudio = document.querySelector("#fechaDesdeEstudio");
let fechaDesdeExperiencia = document.querySelector("#fechaDesdeExperiencia");
let fechaHastaEstudio = document.querySelector("#fechaHastaEstudio");
let fechaHastaExperiencia = document.querySelector("#fechaHastaExperiencia");
let fechaNacimiento = document.querySelector("#fechaNacimiento");
let fechas = [fechaDesdeEstudio,fechaDesdeExperiencia,fechaHastaEstudio,fechaHastaExperiencia,fechaNacimiento]
fechas.forEach(fch => fch.addEventListener('keydown',()=>false))//no dejar cargar manualmente fechas
fechaDesdeEstudio.setAttribute("max", today);
fechaDesdeExperiencia.setAttribute("max", today);
fechaNacimiento.setAttribute("max", today);
fechaDesdeExperiencia.addEventListener("change", ()=>{
fechaHastaExperiencia.setAttribute("min", fechaDesdeExperiencia.value)
})
fechaDesdeEstudio.addEventListener("change", ()=>{
fechaHastaEstudio.setAttribute("min", fechaDesdeEstudio.value)
})
})()
</script> </script>
<script src="./main.js"></script> <script src="./main.js"></script>
</body> </body>
......
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