how to create application form in codding
<!DOCTYPE html>
<html>
<head>
<title>Application Form</title>
</head>
<body>
<h1>Application Form</h1>
<form id="applicationForm">
<label for="name">Name:</label>
<input type="text" id="name" required>
<br>
<label for="email">Email:</label>
<input type="email" id="email" required>
<br>
<button type="submit">Submit</button>
</form>
<p id="message"></p>
<script>
// Get the form and message elements
const form = document.getElementById("applicationForm");
const message = document.getElementById("message");
form.addEventListener("submit", function (event) {
event.preventDefault(); // Prevent form submission
// Get the values of the name and email fields
const name = document.getElementById("name").value;
const email = document.getElementById("email").value;
// Basic validation: Check if the name and email are not empty
if (name.trim() === "" || email.trim() === "") {
message.textContent = "Name and email are required!";
message.style.color = "red";
} else {
// If the fields are not empty, display a success message
message.textContent = `Application submitted for ${name} with email ${email}`;
message.style.color = "green";
// You can also send this data to a server for processing or storage here.
}
});
</script>
</body>
</html>
Application Form
<html>
<head>
<title>Application Form</title>
</head>
<body>
<h1>Application Form</h1>
<form id="applicationForm">
<label for="name">Name:</label>
<input type="text" id="name" required>
<br>
<label for="email">Email:</label>
<input type="email" id="email" required>
<br>
<button type="submit">Submit</button>
</form>
<p id="message"></p>
<script>
// Get the form and message elements
const form = document.getElementById("applicationForm");
const message = document.getElementById("message");
form.addEventListener("submit", function (event) {
event.preventDefault(); // Prevent form submission
// Get the values of the name and email fields
const name = document.getElementById("name").value;
const email = document.getElementById("email").value;
// Basic validation: Check if the name and email are not empty
if (name.trim() === "" || email.trim() === "") {
message.textContent = "Name and email are required!";
message.style.color = "red";
} else {
// If the fields are not empty, display a success message
message.textContent = `Application submitted for ${name} with email ${email}`;
message.style.color = "green";
// You can also send this data to a server for processing or storage here.
}
});
</script>
</body>
</html>
कोई टिप्पणी नहीं