Untitled
unknown
plain_text
a year ago
3.7 kB
5
Indexable
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Format aplikimi</title> <style> .error { color: red; } </style> </head> <body> <h2>Format aplikimi</h2> <form id="applicationForm"> <div> <label for="firstName">Emri:</label> <input type="text" id="firstName" name="firstName" required> </div> <br> <div> <label for="lastName">Mbiemri:</label> <input type="text" id="lastName" name="lastName" required> </div> <br> <div> <label for="age">Mosha:</label> <input type="number" id="age" name="age" required> </div> <br> <div> <label for="phone">Nr telefoni:</label> <input type="tel" id="phone" name="phone"> </div> <br> <div> <label for="email">Adresa e emailit:</label> <input type="email" id="email" name="email" required> </div> <br> <div> <label>Interesat:</label><br> <input type="checkbox" id="interest1" name="interest1" value="sports"> <label for="interest1">Sporti</label><br> <input type="checkbox" id="interest2" name="interest2" value="music"> <label for="interest2">Muzika</label><br> <input type="checkbox" id="interest3" name="interest3" value="movies"> <label for="interest3">Filmat</label> </div> <br> <div> <button type="button" id="submitButton" onclick="displaySummary()">Dergo</button> </div> </form> <div id="displayInfo"></div> <script> // Function to display application summary function displaySummary() { const firstName = document.getElementById('firstName').value; const lastName = document.getElementById('lastName').value; const age = document.getElementById('age').value; const phone = document.getElementById('phone').value; const email = document.getElementById('email').value; // Basic validation (you can expand this as needed) if (firstName.trim() === '' || lastName.trim() === '' || age === '' || email === '') { alert('Please fill in all required fields.'); return; } // Displaying input data const interests = []; if (document.getElementById('interest1').checked) { interests.push(document.getElementById('interest1').value); } if (document.getElementById('interest2').checked) { interests.push(document.getElementById('interest2').value); } if (document.getElementById('interest3').checked) { interests.push(document.getElementById('interest3').value); } const displayDiv = document.getElementById('displayInfo'); displayDiv.innerHTML = ` <h3>Application Summary:</h3> <p><strong>Emri:</strong> ${firstName}</p> <p><strong>Mbiemri:</strong> ${lastName}</p> <p><strong>Mosha:</strong> ${age}</p> <p><strong>Nr telefoni:</strong> ${phone}</p> <p><strong>Adresa e emailit:</strong> ${email}</p> <p><strong>Interesat:</strong> ${interests.length > 0 ? interests.join(', ') : 'None selected'}</p> `; } </script> </body> </html>
Editor is loading...
Leave a Comment