|
|
|
@ -14,7 +14,9 @@ |
|
|
|
</head> |
|
|
|
<body> |
|
|
|
<h1>Registrační formulář</h1> |
|
|
|
<div class="card" style="width: 24rem;"> |
|
|
|
<div class="row"> |
|
|
|
<div class="col"> |
|
|
|
<div class="card"> |
|
|
|
<div class="card-body"> |
|
|
|
<form id="regform" action=""> |
|
|
|
<div class="mb-3"> |
|
|
|
@ -57,7 +59,7 @@ |
|
|
|
</div> |
|
|
|
<div class="mb-3"> |
|
|
|
<label class="form-label" for="birthday">Datum narození</label> |
|
|
|
<input class="form-control" id="birthday" type="date" max="2021-11-03"> |
|
|
|
<input class="form-control" id="birthday" name="birthday" type="date" max="2021-11-03"> |
|
|
|
</div> |
|
|
|
<div class="mb-3"> |
|
|
|
<label class="form-label" for="hobbies">Zájmy</label> |
|
|
|
@ -70,6 +72,12 @@ |
|
|
|
</form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div id="form-report" class="col"> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script> |
|
|
|
<script> |
|
|
|
let form = document.querySelector("#regform"); |
|
|
|
@ -78,10 +86,14 @@ |
|
|
|
event.preventDefault(); |
|
|
|
let data = new FormData(form); |
|
|
|
console.log(data); |
|
|
|
console.log(data.get("name")); |
|
|
|
console.log(data.get("age")); |
|
|
|
|
|
|
|
|
|
|
|
let report = document.querySelector("#form-report"); |
|
|
|
report.innerHTML = "<p>" + data.get("name") + "</p>"; |
|
|
|
report.innerHTML += "<p>" + data.get("age") + "</p>"; |
|
|
|
report.innerHTML += "<p>" + data.get("sex") + "</p>"; |
|
|
|
report.innerHTML += "<p>" + data.get("country") + "</p>"; |
|
|
|
report.innerHTML += "<p>" + data.getAll("news") + "</p>"; |
|
|
|
report.innerHTML += "<p>" + data.get("birthday") + "</p>"; |
|
|
|
report.innerHTML += "<p>" + data.get("hobbies") + "</p>"; |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
