0% found this document useful (0 votes)
2 views

prog2modified

Gg

Uploaded by

arpanroy.cs2020
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
0% found this document useful (0 votes)
2 views

prog2modified

Gg

Uploaded by

arpanroy.cs2020
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>Online Application Form</title>
<style>
label, input, textarea {
display: block;
margin-top: 10px;
}
input, textarea {
width: 300px;
}
input[type="submit"] {
margin-top: 20px;
}
</style>
</head>
<body>

<h2>Application Form</h2>
<form id="applicationForm">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>

<label for="contactNo">Contact Number:</label>


<input type="text" id="contactNo" name="contactNo" required pattern="\d{10}"
title="Contact number should be 10 digits long.">

<label>Order Date:</label>
<label for="day" style="display: inline;">Day:</label>
<input type="number" id="day" name="day" min="1" max="31" required
style="width: auto; display: inline;">
<label for="month" style="display: inline;">Month:</label>
<input type="number" id="month" name="month" min="1" max="12" required
style="width: auto; display: inline;">
<label for="year" style="display: inline;">Year:</label>
<input type="number" id="year" name="year" min="1900" max="2100" required
style="width: auto; display: inline;">

<label for="message">Message:</label>
<textarea id="message" name="message" required></textarea>

<input type="submit" value="Submit">


</form>

<script>
document.getElementById("applicationForm").onsubmit = function(event) {
event.preventDefault();

// Validate form
const name = document.getElementById("name").value;
const contactNo = document.getElementById("contactNo").value;
const day = document.getElementById("day").value;
const month = document.getElementById("month").value;
const year = document.getElementById("year").value;
const message = document.getElementById("message").value;
if (name && contactNo.length === 10 && day >= 1 && day <= 31 && month >= 1 &&
month <= 12 && year >= 1900 && year <= 2100 && message) {
alert("Thank you for your submission.");
} else {
alert("Please ensure all fields are filled out correctly.");
}
};
</script>

</body>
</html>

You might also like