22

✏️ Editing: register.php

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>Petromin Nissan Registration</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #ddd;
      display: flex;
      justify-content: center;
      padding: 40px;
    }
    .form-container {
      background-color: #e3e3e3;
      padding: 30px;
      width: 350px;
      border-radius: 8px;
      text-align: center;
    }
    .form-container img {
      max-width: 150px;
      margin-bottom: 10px;
    }
    .form-container h1 {
      font-size: 22px;
      margin-bottom: 20px;
    }
    .form-container label {
      display: block;
      text-align: left;
      margin: 10px 0 5px;
    }
    .form-container input[type="text"],
    .form-container input[type="email"],
    .form-container input[type="file"],
    .form-container input[type="tel"] {
      width: 100%;
      padding: 8px;
      margin-bottom: 10px;
      border: none;
      border-radius: 4px;
    }
    .form-container select {
      width: 100%;
      padding: 8px;
      margin-bottom: 10px;
      border: none;
      border-radius: 4px;
    }
    .form-container .radio-group {
      display: flex;
      justify-content: space-around;
      margin-bottom: 15px;
    }
    .form-container .radio-group input {
      margin-right: 5px;
    }
    .form-container .submit-btn {
      background-color: #d72626;
      color: white;
      padding: 12px;
      border: none;
      width: 100%;
      font-weight: bold;
      font-size: 16px;
      border-radius: 5px;
      cursor: pointer;
    }
    .form-container .submit-btn:hover {
      background-color: #b01f1f;
    }
    label.error {
      color: red;
      font-size: 13px;
      display: block;
      text-align: left;
      margin-top: -8px;
      margin-bottom: 8px;
    }
  </style>
</head>
<body>
  <form id="registration-form" class="form-container" action="registertestdrive.php" method="post" enctype="multipart/form-data" novalidate>
   <a href="/"><img src="https://nissan-test-drive.core3.agency/assets/Nissan Logo-01.png" alt="Petromin Logo" />   </a> 
    <h1>NISSAN<br>Registration Form</h1>

<label for="first-name">First Name</label>
    <input type="text" id="first-name" name="first-name" />

<label for="mobile">Mobile Number</label>
    <input type="tel" id="mobile" name="mobile" />

<input type="hidden" id="email" value="na@na.com" name="email" />
    
    <label for="agegroup">Age Group</label>
    <select id="agegroup" name="agegroup" />
    <option value="">Please Select Option</option>
    <option value="18-25">18-25</option>
    <option value="26-35">26-35</option>
    <option value="36 and above">36 and above</option>
    
    </select>

<label>Gender</label>
    <div class="radio-group">
      <label><input type="radio" name="gender" value="male" /> Male</label>
      <label><input type="radio" name="gender" value="female" /> Female</label>
    </div>

<label for="license">Image of Driving Licence</label>
    <input type="file" id="license" name="license" accept="image/*" />

<label>Vehicle to Test Drive</label>
    <div class="radio-group">
      <label><input type="radio" name="vehicle" value="magnite" /> Magnite</label>
      <label><input type="radio" name="vehicle" value="kicks" /> Kicks</label>
    </div>

<button type="submit" class="submit-btn">SUBMIT</button>
  </form>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.5/jquery.validate.min.js"></script>

MR SKB