Skip to content

th-app-java
th-app-java
Commit 2f4802c5 by Cesar Giulano Gonzalez Maqueda
Options

Validacion de form (minimo un cargo, tecno)

parent 3161d692
Showing with 105 additions and 199 deletions
curriculumsearch/src/main/resources/static/main.js
......@@ -192,7 +192,6 @@ function serializeJSON (form) {
// Create a new FormData object
const formData = new FormData(form);
// Create an object to hold the name/value pairs
const pairs = {};
......@@ -205,7 +204,23 @@ function serializeJSON (form) {
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){
return;
}
noValidateFlag = false
// Return the JSON string
return JSON.stringify(pairs, null, 2);
......@@ -229,7 +244,11 @@ async function postData(url = '', data = {}) {
body: data // body data type must match "Content-Type" header
}
senddata["headers"][headerxs] = token;
const response = await fetch(url, senddata);
let response = null
console.log(noValidateFlag)
if(!noValidateFlag){
response = await fetch(url, senddata);
}
return response; // parses JSON response into native JavaScript objects
}
formValidator()
......@@ -529,57 +548,57 @@ function eliminarReferencia(event) {
/*--------------------------------------------------------------------------------------------------------- */
$(function(){
$("#wizard").steps({
headerTag: "h4",
bodyTag: "section",
transitionEffect: "fade",
enableAllSteps: true,
transitionEffectSpeed: 500,
onStepChanging: function (event, currentIndex, newIndex) {
if ( newIndex === 1 ) {
$('.steps ul').addClass('step-2');
} else {
$('.steps ul').removeClass('step-2');
}
if ( newIndex === 2 ) {
$('.steps ul').addClass('step-3');
} else {
$('.steps ul').removeClass('step-3');
}
if ( newIndex === 3 ) {
$('.steps ul').addClass('step-4');
$('.actions ul').addClass('step-last');
} else {
$('.steps ul').removeClass('step-4');
$('.actions ul').removeClass('step-last');
}
return true;
},
labels: {
finish: "Order again",
next: "Next",
previous: "Previous"
}
});
// Custom Steps Jquery Steps
$('.wizard > .steps li a').click(function(){
$(this).parent().addClass('checked');
$(this).parent().prevAll().addClass('checked');
$(this).parent().nextAll().removeClass('checked');
});
// Custom Button Jquery Steps
$('.forward').click(function(){
$("#wizard").steps('next');
})
$('.backward').click(function(){
$("#wizard").steps('previous');
})
// Checkbox
$('.checkbox-circle label').click(function(){
$('.checkbox-circle label').removeClass('active');
$(this).addClass('active');
})
})
// $(function(){
// $("#wizard").steps({
// headerTag: "h4",
// bodyTag: "section",
// transitionEffect: "fade",
// enableAllSteps: true,
// transitionEffectSpeed: 500,
// onStepChanging: function (event, currentIndex, newIndex) {
// if ( newIndex === 1 ) {
// $('.steps ul').addClass('step-2');
// } else {
// $('.steps ul').removeClass('step-2');
// }
// if ( newIndex === 2 ) {
// $('.steps ul').addClass('step-3');
// } else {
// $('.steps ul').removeClass('step-3');
// }
//
// if ( newIndex === 3 ) {
// $('.steps ul').addClass('step-4');
// $('.actions ul').addClass('step-last');
// } else {
// $('.steps ul').removeClass('step-4');
// $('.actions ul').removeClass('step-last');
// }
// return true;
// },
// labels: {
// finish: "Order again",
// next: "Next",
// previous: "Previous"
// }
// });
// // Custom Steps Jquery Steps
// $('.wizard > .steps li a').click(function(){
// $(this).parent().addClass('checked');
// $(this).parent().prevAll().addClass('checked');
// $(this).parent().nextAll().removeClass('checked');
// });
// // Custom Button Jquery Steps
// $('.forward').click(function(){
// $("#wizard").steps('next');
// })
// $('.backward').click(function(){
// $("#wizard").steps('previous');
// })
// // Checkbox
// $('.checkbox-circle label').click(function(){
// $('.checkbox-circle label').removeClass('active');
// $(this).addClass('active');
// })
// })
/*--------------------------------------------------------------------------------------------------------- */
\ No newline at end of file
curriculumsearch/src/main/webapp/jsp/postulante-form.jsp
......@@ -10,139 +10,8 @@
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<<<<<<< HEAD
<title>Curriculum</title>
<link href="../css/formPostulanteStyle.css" rel="stylesheet" type="text/css"/>
=======
<title>Hello, world!</title>
<style type="text/css" media="screen">
body {
background-color: #506BEE
}
.card {
border: none
}
.image {
position: relative
}
.image span {
background-color: #506BEE;
color: #fff;
padding: 6px;
height: 30px;
width: 30px;
border-radius: 50%;
font-size: 13px;
position: absolute;
display: flex;
justify-content: center;
align-items: center;
top: -0px;
right: 0px
}
.user-details h4 {
color: #506BEE
}
.ratings {
font-size: 30px;
font-weight: 600;
display: flex;
justify-content: left;
align-items: center;
color: #f9b43a
}
.user-details span {
text-align: left
}
.inputs label {
display: flex;
margin-left: 3px;
font-weight: 500;
font-size: 13px;
margin-bottom: 4px
}
.inputs input {
font-size: 14px;
height: 40px;
border: 2px solid #ced4da
}
.inputs input:focus {
box-shadow: none;
border: 2px solid #506BEE
}
.about-inputs label {
display: flex;
margin-left: 3px;
font-weight: 500;
font-size: 13px;
margin-bottom: 4px
}
.about-inputs textarea {
font-size: 14px;
height: 100px;
border: 2px solid #ced4da;
resize: none
}
.about-inputs textarea:focus {
box-shadow: none
}
.btn {
font-weight: 600
}
.btn:focus {
box-shadow: none
}
select {
display: block;
width: 100%;
border: 1px solid #ddd;
border-radius: 10px;
height: 40px;
padding: 5px 10px
}
select:focus {
outline: none
}
.add-experience:hover {
background: #506BEE;
color: #fff;
cursor: pointer;
border: solid 1px #506BEE
}
#outer
{
width:100%;
text-align: center;
}
.inner
{
display: inline-block;
}
</style>
>>>>>>> c5960f1813048de41cb9806ad2accf77e4d8aece
</head>
<body class="container">
......@@ -278,18 +147,25 @@
</select> </div>
<div class="inputs p-3 py-5">
<div class=" inputs d-flex justify-content-between align-items-center experience"><span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#cargoForm"><i class="fa fa-plus"></i>&nbsp;Cargo al que postulas</span></div><br>
<div class="inputs d-flex justify-content-between align-items-center experience">
<span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#cargoForm">
<i class="fa fa-plus"></i>&nbsp;Cargo al que postulas
</span>
</div><br>
</div>
<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</p>
<div class="mt-3 gap-2 d-flex justify-content-between" id="cargos">
</div>
<div class="inputs p-3 py-5">
<div class=" inputs d-flex justify-content-between align-items-center experience"><span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#experienciaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Experiencia</span></div><br>
<div class=" inputs d-flex justify-content-between align-items-center experience">
<span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#experienciaForm">
<i class="fa fa-plus"></i>&nbsp;Agregar Experiencia
</span>
</div><br>
</div>
<div class="mt-3 gap-2 d-flex justify-content-between" id="experiencias">
......@@ -297,20 +173,26 @@
<div class=" p-3 py-5">
<div class=" d-flex justify-content-between align-items-center experience"><span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#estudioForm"><i class="fa fa-plus"></i>&nbsp;Agregar Estudio</span></div><br>
<div class=" d-flex justify-content-between align-items-center experience">
<span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#estudioForm">
<i class="fa fa-plus"></i>&nbsp;Agregar Estudio
</span>
</div><br>
</div>
<div class="mt-3 gap-2 d-flex justify-content-between" id="estudios">
</div>
<div class=" p-3 py-5">
<div class=" d-flex justify-content-between align-items-center experience"><span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#tecnologiaForm"><i class="fa fa-plus"></i>&nbsp;Agregar Tecnologia</span></div><br>
<div class=" d-flex justify-content-between align-items-center experience">
<span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#tecnologiaForm">
<i class="fa fa-plus"></i>&nbsp;Agregar Tecnologia
</span>
</div><br>
</div>
<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</p>
<div class="mt-3 gap-2 d-flex justify-content-between" id="tecnologias">
......@@ -318,7 +200,11 @@
<div class=" p-3 py-5">
<div class=" d-flex justify-content-between align-items-center experience"><span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#referenciaForm"><i class="fa fa-plus"></i>&nbsp;Referencias Personales</span></div><br>
<div class=" d-flex justify-content-between align-items-center experience">
<span class="border px-3 p-1 add-experience" data-toggle="modal" data-target="#referenciaForm">
<i class="fa fa-plus"></i>&nbsp;Referencias Personales
</span>
</div><br>
</div>
<div class="mt-3 gap-2 d-flex justify-content-between" id="referencia">
</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