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.
79 lines
2.2 KiB
79 lines
2.2 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Formulář</title>
|
|
<style>
|
|
label:hover {
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Registrační formulář</h1>
|
|
<form id="regform" action="">
|
|
<p>
|
|
<input type="text" name="name" value="" placeholder="e.g. Bob">
|
|
</p>
|
|
<p>
|
|
<input type="number" name="age" min="1" max="199" placeholder="Your age">
|
|
</p>
|
|
|
|
<p>
|
|
pohlaví <br>
|
|
<input id="male" type="radio" name="sex" value="male"> <label for="male">muž</label>
|
|
<input id="female" type="radio" name="sex" value="female"> <label for="female">žena</label>
|
|
</p>
|
|
|
|
<p>
|
|
<select name="country">
|
|
<option value="CZ">Česko</option>
|
|
<option value="SK">Slovensko</option>
|
|
<option value="DE">Německo</option>
|
|
</select>
|
|
</p>
|
|
<p>
|
|
Chci zasílat novinky z: <br>
|
|
<input type="checkbox" name="news" value="1" id="vedtech">
|
|
<label for="vedtech">Věda a technika</label> <br>
|
|
<input type="checkbox" name="news" value="2" id="eko">
|
|
<label for="eko">Ekonomika</label>
|
|
</p>
|
|
|
|
<p>
|
|
<label for="">Datum narození</label>
|
|
<input type="date" max="2021-11-03">
|
|
</p>
|
|
|
|
<p>
|
|
<label for="">Zájmy</label>
|
|
<textarea name="zajmy" id="" cols="30" rows="10"></textarea>
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<input type="submit" name="reg" value="Registrovat">
|
|
<button type="submit">Registrovat 2</button>
|
|
</form>
|
|
|
|
<script>
|
|
let form = document.querySelector("#regform");
|
|
|
|
form.addEventListener("submit", function(event) {
|
|
event.preventDefault();
|
|
let data = new FormData(form);
|
|
console.log(data);
|
|
console.log(data.get("name"));
|
|
console.log(data.get("age"));
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|