You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
166 lines
3.5 KiB
166 lines
3.5 KiB
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<link rel="stylesheet" type="text/css" href="css/bootstrap-reboot.css">
|
|
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
|
|
<link rel="stylesheet" type="text/css" href="css/bootstrap-grid.css">
|
|
|
|
<script src="js/jquery.js"></script>
|
|
|
|
<title>E - letenka</title>
|
|
<style >
|
|
body{
|
|
background-image: url(img/original.jpeg);
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
|
|
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<h3>E - letenka</h3>
|
|
<a>zadejte datum/čas</a>
|
|
<form method="POST" action="" id="main-form">
|
|
<input type="date" name="den-odletu" min="2020-03-04" id="den-odletu" class="form-control">
|
|
<a>zadejte destinaci</a>
|
|
<div class="form-group">
|
|
<select name="cil">
|
|
<option value="Brno"> Brno </option>
|
|
<option value="Berlín">Berlín</option>
|
|
<option value="Praha">Praha</option>
|
|
<option value="Pardubice"> Pardubice </option>
|
|
<option value="Bratislava">Bratislava</option>
|
|
<option value="Ostrava">Ostrava</option>
|
|
</select>
|
|
</div>
|
|
<a>zadejte třídu</a>
|
|
<div class="form-group">
|
|
<select name="trida">
|
|
|
|
<option value="normal">normal</option>
|
|
<option value="bussiness">Bussiness</option>
|
|
<option value="economy">Economy</option>
|
|
</select>
|
|
</div>
|
|
<a>zadejte počet osob</a>
|
|
<div class="form-group">
|
|
|
|
<input placeholder="Počet osob" value="1" type="number" min="1" value="pocet" id="pocetOsob">
|
|
|
|
</div>
|
|
<a > vyberte sedadlo</a>
|
|
<div class="form-group">
|
|
<table id="letadlo">
|
|
</table>
|
|
|
|
</div>
|
|
<input type="submit" name="book" value="Rezervovat let" class="btn btn-primary">
|
|
</form>
|
|
</div>
|
|
<div class="col-md-9 border-left">
|
|
<br>
|
|
<div id="order-box">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|
|
|
|
<script>
|
|
|
|
|
|
|
|
|
|
$(this).ready(function(){
|
|
|
|
let pocetMistLetadlo = 9;
|
|
let rady = 3;
|
|
|
|
let osoby = $("#pocetOsob").val();
|
|
let vybrano = 0;
|
|
|
|
$("#pocetOsob").attr("max",pocetMistLetadlo);
|
|
|
|
$("#pocetOsob").change(function(){
|
|
osoby = $("#pocetOsob").val();
|
|
});
|
|
|
|
$("#main-form").submit(function(e){
|
|
e.preventDefault();
|
|
alert("Chcete Rezervovat tento let?");
|
|
});
|
|
|
|
|
|
for(let i = 1; i <= rady;i++){
|
|
|
|
$("#letadlo").append("<tr>");
|
|
|
|
for(let j = 1; j <= (pocetMistLetadlo/rady);j++){
|
|
|
|
$("#letadlo tr:last-child").append("<td>"+ j +"</td>");
|
|
$("#letadlo td:last-child").css("background-color","orange");
|
|
$("#letadlo td:last-child").attr("id",i+"-"+j);
|
|
|
|
}
|
|
}
|
|
|
|
let send = false;
|
|
|
|
$("#main-form").submit(function(e){
|
|
|
|
let formData = $("#main-form").serializeArray();
|
|
|
|
console.log(formData[0]["name"]);
|
|
console.log(formData[0]["value"]);
|
|
|
|
if(!send){
|
|
for(let i = 0;i < formData.length;i++){
|
|
|
|
$("#order-box").append(formData[i]["name"]+": ");
|
|
$("#order-box").append(formData[i]["value"]);
|
|
$("#order-box").append("<br>");
|
|
}
|
|
send = true;
|
|
|
|
}
|
|
|
|
|
|
if(send){
|
|
e.preventDefault();
|
|
}
|
|
else{
|
|
alert("Objednávka byla zrušena.");
|
|
|
|
}
|
|
|
|
});
|
|
|
|
$("#letadlo td").click(function(e){
|
|
$(e.target).text();
|
|
|
|
if(vybrano >= osoby){
|
|
alert("Moc osob");
|
|
return false;
|
|
}
|
|
|
|
$(e.target).css("background-color","red");
|
|
vybrano = vybrano+1;
|
|
|
|
});
|
|
|
|
|
|
});
|
|
</script>
|