HTML5 IOE examination registration form

Assumptions: the form is processed by register.php using the POST method. HTML5 input types and the required attribute are used for validation.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>IOE Examination Registration</title>
  <style>
    body { font-family: Arial, sans-serif; }
    form { width: 340px; margin: 20px auto; padding: 15px; border: 1px solid #888; }
    label { display: block; margin-top: 10px; font-weight: bold; }
    input[type=text], input[type=email], select { width: 100%; padding: 6px; }
    input[type=submit] { margin-top: 15px; padding: 6px 16px; }
  </style>
</head>
<body>
  <form action="register.php" method="post">
    <h2>IOE Examination Registration</h2>

    <label for="fname">First Name</label>
    <input type="text" id="fname" name="FirstName" required pattern="[A-Za-z ]+"
           placeholder="First name">

    <label for="lname">Last Name</label>
    <input type="text" id="lname" name="LastName" required pattern="[A-Za-z ]+"
           placeholder="Last name">

    <label for="email">Email</label>
    <input type="email" id="email" name="Email" required placeholder="you@example.com">

    <label for="college">College Name</label>
    <input type="text" id="college" name="CollegeName" list="colleges" required>
    <datalist id="colleges">
      <option value="Pulchowk Campus">
      <option value="Thapathali Campus">
      <option value="Kathmandu Engineering College">
    </datalist>

    <label>Gender</label>
    <input type="radio" id="m" name="Gender" value="Male" required>
    <label for="m" style="display:inline;font-weight:normal">Male</label>
    <input type="radio" id="f" name="Gender" value="Female">
    <label for="f" style="display:inline;font-weight:normal">Female</label>
    <input type="radio" id="o" name="Gender" value="Other">
    <label for="o" style="display:inline;font-weight:normal">Other</label>

    <label for="exam">Exam Type</label>
    <select id="exam" name="ExamType" required>
      <option value="">-- Select --</option>
      <option value="Regular">Regular</option>
      <option value="Back">Back</option>
    </select>

    <input type="submit" value="Register">
    <input type="reset" value="Clear">
  </form>
</body>
</html>

Explanation

• type="email" makes the browser check the email format; required stops submission of empty fields; pattern restricts names to letters.
• Radio buttons share the same name so only one gender can be chosen.
• <select> gives the Regular/Back choice; <datalist> suggests college names while still allowing typing.
• On submit, the browser sends the fields (FirstName, LastName, Email, CollegeName, Gender, ExamType) to register.php.