<link rel="stylesheet" href="/static/css/base.css"> <link rel="stylesheet" href="/static/css/dist/styles.css">  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">      <script src="/static/js/jquery-3.7.1-min.js"></script> <script src="/static/js/dashboard.js"></script> <script src="/static/js/general.js"></script> <script src="/static/js/datatable.js"></script> <script src="/static/js/register_project.js"></script> <script src="/static/js/dropzone.js"></script>       <script src="/static/js/jquery-3.7.1-min.js"></script> <link rel="stylesheet" href="/static/css/dataTables.css">   <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/css/select2.min.css" rel="stylesheet" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.13/js/select2.min.js"></script> <link rel="stylesheet" href="https://cdn.datatables.net/1.13.7/css/dataTables.tailwindcss.min.css"> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script> <link rel="stylesheet" href="/static/css/dropzone.min.css"> <script src="/static/js/dropzone.min.js"></script>   <script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.2.1/flowbite.min.js"></script>  <script src="/static/js/dropdown_selection.js"></script> <script src="/static/js/form_edit.js"></script>  <script src="https://unpkg.com/htmx.org@1.9.6" integrity="sha384-FhXw7b6AlE/jyjlZH5iHa/tTe9EpJ1Y55RjcgPbjeWMskSxZt1v9qkxLJWNJaGni" crossorigin="anonymous" ></script>  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script> <body class="bg-gray-200"> <div class="m-8 w-8/12 mx-auto border-2 shadow-md rounded-lg bg-white"> <div class="mb-8 logo flex justify-center items-center pt-12"><a href="https://www.greenre.org/"><img src="/static/image/greenre-new-logo.png"></a></div> <p class="text-center mb-4 text-l font-semibold font-custom">Step 1 of 3</p> <ul class="w-6/12 mx-auto progress-bar font-semibold mb-6"> <li class="active">Personal Info</li> <li class="">Contact Info</li> <li class="">Password</li> </ul> <div class="p-8 m-8 mb-16 w-6/12 mx-auto border-2 shadow-md rounded-lg font-custom"> <h3 class="text-center font-semibold text-3xl mb-8">Personal Information</h3> <form id="user-registration-form" method="post" novalidate> <input type="hidden" name="csrfmiddlewaretoken" value="dwS25X1YovQeiKsqyymbfkQRJ6oODvwtgyHupudVCK9mk2RPK7TiUnECaDqccfWm"> <input type="hidden" name="user_registration-current_step" value="0" id="id_user_registration-current_step"> <form method="post" > <input type="hidden" name="csrfmiddlewaretoken" value="dwS25X1YovQeiKsqyymbfkQRJ6oODvwtgyHupudVCK9mk2RPK7TiUnECaDqccfWm"> <div class="form-group px-2 w-full" > <div id="div_id_0-first_name" class="mb-3"> <label for="id_0-first_name" class="block text-gray-700 text-sm font-bold mb-2"> First Name (Given Name)<span class="asteriskField">*</span> </label> <input type="text" name="0-first_name" maxlength="255" class="textinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" required id="id_0-first_name"> </div> </div> <div class="form-group px-2 w-full" > <div id="div_id_0-last_name" class="mb-3"> <label for="id_0-last_name" class="block text-gray-700 text-sm font-bold mb-2"> Last Name (Surname)<span class="asteriskField">*</span> </label> <input type="text" name="0-last_name" maxlength="255" class="textinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" required id="id_0-last_name"> </div> </div> <div class="form-group px-2 w-full" > <div id="div_id_0-ic_number" class="mb-3"> <label for="id_0-ic_number" class="block text-gray-700 text-sm font-bold mb-2"> Identification Card Number/ Passport Number<span class="asteriskField">*</span> </label> <input type="text" name="0-ic_number" maxlength="255" placeholder="only alphanumerical characters are allowed" class="textinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" required id="id_0-ic_number"> </div> </div> <div class="form-group px-2 w-full" > <div id="div_id_0-nationality" class="mb-3"> <label for="id_0-nationality" class="block text-gray-700 text-sm font-bold mb-2"> Place Of Birth / Nationality<span class="asteriskField">*</span> </label> <input type="text" name="0-nationality" maxlength="30" class="textinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" required id="id_0-nationality"> </div> </div> <div class="form-group px-2 w-full" > <div id="div_id_0-date_of_birth" class="mb-3"> <label for="id_0-date_of_birth" class="block text-gray-700 text-sm font-bold mb-2"> Date Of Birth<span class="asteriskField">*</span> </label> <input type="date" name="0-date_of_birth" class="dateinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" required id="id_0-date_of_birth"> </div> </div> <div class="form-group radio-inline px-2 w-full" > <div id="div_id_0-gender" class="mb-3"> <label for="" class="block text-gray-700 text-sm font-bold mb-2"> Gender<span class="asteriskField">*</span> </label> <div class="mb-3"> <label for="id_0-gender_1" class="block text-gray-700 mr-3"> <input type="radio" class="" name="0-gender" id="id_0-gender_1" value="M" > Male </label> <label for="id_0-gender_2" class="block text-gray-700 mr-3"> <input type="radio" class="" name="0-gender" id="id_0-gender_2" value="F" > Female </label> </div> </div> </div> <div class="form-group px-2 w-full" > <div id="div_id_0-email" class="mb-3"> <label for="id_0-email" class="block text-gray-700 text-sm font-bold mb-2"> Email<span class="asteriskField">*</span> </label> <input type="email" name="0-email" maxlength="255" class="emailinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" required id="id_0-email"> </div> </div> <div class="form-group px-2 w-full" > <div id="div_id_0-professional_code" class="mb-3"> <label for="id_0-professional_code" class="block text-gray-700 text-sm font-bold mb-2"> GREENRE Accredited Professional's Code </label> <input type="text" name="0-professional_code" maxlength="255" class="textinput border leading-normal text-gray-700 w-full py-2 appearance-none rounded-lg bg-white block focus:outline-none px-4 border-gray-300" id="id_0-professional_code"> </div> </div> <div class="flex justify-end"> <div class="flex justify-between"> <button class="cursor-not-allowed inline-block w-28 mt-8 bg-blue-50 text-white font-semibold py-2 rounded mr-2" disabled>Previous</button> <button name="wizard_goto_step" type="submit" class="inline-block w-28 block mr-1 mt-8 border border-blue-500 bg-transparent text-blue-500 hover:bg-blue-700 hover:text-white font-semibold py-2 rounded">Next</button> </div> </div> </form> </form> <hr class="w-full block mx-auto pt-2"> <div class="mt-4 mb-4"> <div class="text-center m-2">Back to <a href="/login/" class="text-blue-500"><b>Login</b></a></div> </div> </div> <script> function togglePasswordVisibility(passwordFieldId, toggleIconId) { var passwordInput = document.getElementById(passwordFieldId); var toggleIcon = document.getElementById(toggleIconId); if (passwordInput.type === 'password') { passwordInput.type = 'text'; toggleIcon.textContent = 'visibility'; } else { passwordInput.type = 'password'; toggleIcon.textContent = 'visibility_off'; } } </script> </div> <script src="/static/js/disablemultipleclick.js"></script> </body>

CINXE.COM