Current File : /home/digitaw/Ycof/js/voyag.js

var form_1 = document.querySelector(".form_1");
var form_2 = document.querySelector(".form_2");
var form_3 = document.querySelector(".form_3");
var form_4 = document.querySelector(".form_4");
// evenement d'ecoute sur l'input destination 



var form_1_btns = document.querySelector(".form_1_btns");
var form_2_btns = document.querySelector(".form_2_btns");
var form_3_btns = document.querySelector(".form_3_btns");
var form_4_btns = document.querySelector(".form_4_btns");


var form_1_next_btn = document.querySelector(".form_1_btns .btn_next");
var form_2_back_btn = document.querySelector(".form_2_btns .btn_back");
var form_2_next_btn = document.querySelector(".form_2_btns .btn_next");
var form_3_back_btn = document.querySelector(".form_3_btns .btn_back");
var form_3_next_btn = document.querySelector(".form_3_btns .btn_next");
var form_4_back_btn = document.querySelector(".form_4_btns .btn_back");

var form_2_progessbar = document.querySelector(".form_2_progessbar");
var form_3_progessbar = document.querySelector(".form_3_progessbar");
var form_4_progessbar = document.querySelector(".form_4_progessbar");

var btn_done = document.querySelector(".btn_done");
var modal_wrapper = document.querySelector(".modal_wrapper");
var shadow = document.querySelector(".shadow");

// form_1_next_btn.addEventListener("click", function(){
// 	loadData();
// 	form_1.style.display = "none";
// 	form_2.style.display = "block";
// 	form_1_btns.style.display = "none";
// 	form_2_btns.style.display = "flex";
// 	form_2_progessbar.classList.add("active");
// });
loadData();

form_2_back_btn.addEventListener("click", function(){
	form_1.style.display = "block";
	form_2.style.display = "none";

	form_1_btns.style.display = "flex";
	form_2_btns.style.display = "none";

	form_2_progessbar.classList.remove("active");
});

form_2_next_btn.addEventListener("click", function(){
	form_2.style.display = "none";
	form_3.style.display = "block";

	form_3_btns.style.display = "flex";
	form_2_btns.style.display = "none";

	form_3_progessbar.classList.add("active");
});

form_3_back_btn.addEventListener("click", function(){
	form_2.style.display = "block";
	form_3.style.display = "none";

	form_3_btns.style.display = "none";
	form_2_btns.style.display = "flex";
	form_3_progessbar.classList.remove("active");
});
form_3_next_btn.addEventListener("click", function(){
	form_3.style.display = "none";
	form_4.style.display = "block";

	form_4_btns.style.display = "flex";
	form_3_btns.style.display = "none";

	form_4_progessbar.classList.add("active");
});
form_4_back_btn.addEventListener("click", function(){
	form_3.style.display = "block";
	form_4.style.display = "none";

	form_4_btns.style.display = "none";
	form_3_btns.style.display = "flex";

	form_4_progessbar.classList.remove("active");
});

btn_done.addEventListener("click", function(){
	modal_wrapper.classList.add("active");
})

shadow.addEventListener("click", function(){
	modal_wrapper.classList.remove("active");
})

function loadData(){
	var destination = document.getElementById("destination").value;
	var numeroPassport=document.getElementById("numpass").value;
	var numeroDepart = document.getElementById("numDepart").value;
	var numRetour = document.getElementById("numRetour").value;
	var destRecap = document.getElementById("dest");
	// gestion de la validation des donnnees 
	destRecap.innerHTML = destination;
	var numPassRecap = document.getElementById("numero");
	numPassRecap.innerHTML = numeroPassport;
	var departRecap = document.getElementById("dateDepart");
	departRecap.innerHTML = numeroDepart;
	var retourRecap = document.getElementById("dateRetour");
	retourRecap.innerHTML = numRetour;
}

function validateDestination(){
	var destination = document.getElementById("destination").value;
	var destinationError = document.getElementById("destinationError");
	if(destination.length == 0){
		destinationError.innerHTML = "destination is required";
	}
	if(destination.length > 0){
		destinationError.innerHTML = "";
	}
	// expression reguliere
	var regex = /^[a-zA-Z\s]+$/;
	if(!regex.test(destination)){
		
		destinationError.innerHTML = "ce champs accepte que des lettres";
	}
	
}