Scribd
Upload
4 views2 pages

!DOCTYPE HTML

The document is an HTML form for a job application that includes fields for name, email, preferred date, gender selection, and hobbies. It features radio buttons for gender and checkboxes for hobbies, along with submit and reset buttons. Additionally, there is JavaScript code for validating the date of birth input and checking the age of the applicant.

Uploaded by

anesg491
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
4 views2 pages

!DOCTYPE HTML

The document is an HTML form for a job application that includes fields for name, email, preferred date, gender selection, and hobbies. It features radio buttons for gender and checkboxes for hobbies, along with submit and reset buttons. Additionally, there is JavaScript code for validating the date of birth input and checking the age of the applicant.

Uploaded by

anesg491
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Example</title>
<link rel="stylesheet" href="styles.css">

</head>
<body>

<form>
<h1 class="head">Job Application:</h1>

<label for="name">Nom et prenom


</label>
<input type="text" name="name">

<label for="email">Email</label>
<input type="email" name="email">

<label for="date">Preferred Date:</label>


<input type="date" id="date" required>

<fieldset>
<legend>Sexe</legend>
<label for="homme">Homme</label>
<input type="radio" name="sexe" value="homme">
<label for="femme">Homme</label>
<input type="radio" name="sexe" value="femme">
<label for="autre">autre</label>
<input type="radio" name="sexe" value="autre">
</fieldset>

<fieldset>
<legend>Loisirs</legend>
<label for="escalade">Escalade </label>
<input type="checkbox" name="loisirs" value="Escalade" >
<label for="randonnee">Randonnée </label>
<input type="checkbox" name="loisirs" value="Randonnee">
<label for="vtt">VTT</label>
<input type="checkbox" name="loisirs" value="VTT">
</fieldset>

<button type="submit">Envoyer</button>
<button type="reset">Recommencer</button>
</form>

</body>
<script src="script.js"></script>

</html>
const dob = document.getElementById('dob').value;
const dobDate = new Date(dob.split('/').reverse().join('-'));
if (isNaN(dobDate.getTime())) {
document.getElementById('dob').classList.add('error');
document.getElementById('errorMessage').classList.remove('hidden');
return;
}
const ageDiff = Date.now() - dobDate.getTime();
const ageDate = new Date(ageDiff);
const age = Math.abs(ageDate.getUTCFullYear() - 1970);

if (age < 12) {


document.getElementById('ageMessage').classList.remove('hidden');
isValid = false;
}

You might also like