Form

nilajcoder · nilajcoder · commit 74d0bdb98a53 · 2025-05-05T23:06:14.000+05:30
diff --git a/Form/form.html b/Form/form.html
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+  
+</head>
+<body>
+
+
+    
+
+
+        <h1>Form</h1>
+
+        <form id="userForm" onsubmit="handleSubmit(event)">
+            <label for="name">Name</label>
+            <input type="text" id="name" placeholder="Enter Your name" required><br><br>
+
+        
+            <label for="email">Email</label>
+            <input type="email" id="email" placeholder="Enter Email" required><br><br>
+        
+            <label for="phone">Phone Number</label>
+            <input type="tel" id="phone" placeholder="Enter Phone number" required><br><br>
+        
+            <label for="address">Address</label>
+            <input type="text" id="address" placeholder="Enter Address" required><br><br>
+        
+            <label>Gender</label>
+            <div class="gender-options">
+              <label><input type="radio" name="gender" value="Male" required> Male</label>
+              <label><input type="radio" name="gender" value="Female"> Female</label>
+            </div>
+        
+            <label for="course">Course</label><br>
+            <select id="course" required>
+              <option value="">--Select Course--</option><br><br>
+              <option value="Web Development">Web Development</option>
+              <option value="Data Science">Data Science</option>
+            </select>
+            <br><br>
+        
+            <button type="submit">Submit</button>
+          </form>
+        
+          <div class="output" id="output"></div>
+        
+          <script>
+            function handleSubmit(event) {
+              event.preventDefault();
+          
+              const name = document.getElementById('name').value;
+              const email = document.getElementById('email').value;
+              const phone = document.getElementById('phone').value;
+              const address = document.getElementById('address').value;
+              const gender = document.querySelector('input[name="gender"]:checked')?.value || '';
+              const course = document.getElementById('course').value;
+          
+              const output = document.getElementById('output');
+              output.innerHTML = `
+                <h3>Submitted Data</h3>
+                <p><strong>Name:</strong> ${name}</p>
+                <p><strong>Email:</strong> ${email}</p>
+                <p><strong>Phone:</strong> ${phone}</p>
+                <p><strong>Address:</strong> ${address}</p>
+                <p><strong>Gender:</strong> ${gender}</p>
+                <p><strong>Course:</strong> ${course}</p>
+              `;
+          
+              event.target.reset();
+            }
+          </script>
+          
+   
+  
+   
+    
+</body>
+</html>
