Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html xmlns:th="http://www.thymeleaf.org">
- <head>
- <title>ghgPrivate Client Registration Form - Premier FX Online Currency Transfers, Algarve, Portugal</title>
- <meta charset="utf-8"/>
- <meta name="description" content="Our services are tailored to help expatriates living abroad, businesses or their clients, and those who own or plan to buy overseas assets such as property." />
- <meta name="keywords" content="currency exchange specialists, FX, foreign exchange, forex, money transfers, sterling, euro, eurozone, exchange rates, currency planning, currency rates, currency trading, forward trading, Premier FX, Algarve, Portugal, www.premfx.com" />
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <meta name="viewport" content="width=device-width; initial-scale = 1.0; maximum-scale=1.0; user-scalable=no" />
- <meta http-equiv="imagetoolbar" content="no"/>
- <link th:href="@{/resources/css/online/style_online.css}" rel="stylesheet" type="text/css"/>
- <link th:href="@{/resources/css/online/style_online_responsive.css}" rel="stylesheet" type="text/css"/>
- <link th:href="@{/resources/css/online/intlTelInput.css}" rel="stylesheet"/>
- <link th:href="@{/resources/css/online/jquery-ui.css}" rel="stylesheet" type="text/css" />
- <link th:href="@{/resources/css/online/dropzone.css}" rel="stylesheet"/>
- <link th:href="@{/resources/css/online/custom.css}" rel="stylesheet"/>
- <link th:href="@{/resources/FileUpload/style.css}" rel="stylesheet"/>
- <style>
- .radio_mini{
- vertical-align: text-bottom
- margin-right: 5px;}
- .already_wrapp{margin-bottom:-50px;}
- .success {
- color: #4F8A10;
- background-color: #DFF2BF;
- background-image:url("../resources/images/Knob_Valid_Green.png");
- width: 50%;
- }
- .success {
- border: 1px solid;
- margin: 10px 0px;
- padding:15px 10px 15px 50px;
- background-repeat: no-repeat;
- background-position: 10px center;
- }
- .form_fields, .form_fields_new, .form_fields_new, .form_label1 {
- display: block;
- margin: 0 auto;
- }
- .form_fields_new, .form_label1 {
- width: 330px;
- }
- .form_label1 {
- float: none;
- padding-left: 0;
- width: 330px;
- }
- .heading_beneficiary {
- margin-left: 20px;
- }
- .main-file-input {
- position: relative;
- border: 1px solid #cecdcd;
- width: 330px;
- height: 100px;
- font-family: "PT Sans";
- font-size: 20px;
- text-align: center;
- color: white;
- margin: 0 auto;
- margin-bottom: 10px;
- }
- .input-invisible {
- position: absolute;
- width: 330px;
- height: 100px;
- opacity: 0;
- left: 0;
- cursor: pointer;
- }
- .file-upload {
- width: 330px;
- height: 75px;
- background: #678dbb;
- padding-top: 25px;
- }
- #inputAdd {
- position: relative;
- left: 100px;
- }
- .document-selection {
- width: 330px;
- margin-bottom: 10px;
- }
- .btn-add-new-doc {
- width: 330px;
- }
- .btn-margin {
- margin-top: 10px;
- }
- .title-loaded-file {
- width: 290px;
- overflow: hidden;
- font-family: "PT Sans";
- margin: 0 auto;
- font-size: 20px;
- margin-bottom: 10px;
- padding: 3px 0;
- }
- .delete-img-file {
- vertical-align: top;
- cursor: pointer;
- height: 32px;
- margin-left: -5px;
- }
- .imgLoadInf {
- display: inline-block;
- }
- .form_fields_large {
- width: 330px;
- }
- </style>
- <script type="text/javascript" th:inline="javascript">
- /* <![CDATA[ */
- function setLocation() {
- frm = document.forms[0];
- frm.submit();
- }
- var defaultDateFormat = [[${
- defaultDateFormat
- }
- ]];
- var currency = [[${customerBean}]];
- //console.log(currency);
- var utilJSPath = /*[[@{/resources/js/online/utils.js}]]*/
- var ctx = /*[[@{/}]]*/
- function showHideGBGroupValidation() {
- var sendingCountry = $("#sendingCountry option:selected").text();
- //alert(sendingCountry);
- if(sendingCountry == 'United Kingdom'){
- $("#senderPostalCodeId").removeClass('form_fields');
- $("#senderPostalCodeId").addClass('form_fields_new');
- document.getElementById("lookUpAddress").style.display ='inline-block';
- }else{
- document.getElementById("lookUpAddress").style.display ='none';
- $("#senderPostalCodeId").removeClass('form_fields_new');
- $("#senderPostalCodeId").addClass('form_fields');
- }
- }
- /* ]]> */
- </script>
- </head>
- <body>
- <div id="wait" style="position:fixed;height:100%;width:100%;background:#222;opacity:0.7;display:none;z-index:999">
- <div style="margin: 0 auto;position: relative;top: 50%;font-size:24px;color:#fff;font-family:arial;text-align:center">
- <img th:src="@{/resources/images/online/loading.gif}" alt=""/>
- <span id="loadingMessage" style="white-space:nowrap;"> Loading...</span>
- </div>
- </div>
- <!-- main container-->
- <div class="container">
- <div class="upper_container">
- <!-- Header Logo -->
- <div th:replace="header :: logo"></div>
- </div>
- <!-- lower container -->
- <div class="lower_container">
- <div class="body_area">
- <div class="logout_area">
- <h2 class="heading">Open an account</h2>
- <div class="logout">
- </div>
- </div>
- <form name="senderRegistrationForm" id="senderRegistrationForm" th:object="${customerBean}" th:action="@{/public/signup}" method="post" enctype='multipart/form-data'>
- <div class="content_area">
- <div class="content_area_main" style="padding: 0px 0px 0px 12px;">
- <div class="field_wrapper_large">
- <div class="content_area_center">
- <div th:if="${success != null}" class="content_area_center" style="margin-bottom: 0px;">
- <div class="success" th:text="${success}" style="margin: 0 auto;">
- </div>
- </div>
- <p class="content_heading">Open an account: private client</p>
- <p class="content_subheading">Please complete the form below<span id="form_inst"> and upload one form of identification to comply with UK money laundering regulations, we require a valid Passport</span></p>
- <h1 class="heading_beneficiary" align="center">Personal Information</h1>
- <div class="field_wrapper reg_title form-group field_wrapper_center_align">
- <label class="form_label1">Title:</label><br/>
- <select id="title" th:field="*{title}" class="form_fields">
- <!--<option value="" th:text="#{common.select.prompt}"></option>-->
- <option th:each="entry : ${onlineTitleList.entrySet()}" th:value="${entry.key}" th:text="${entry.value}" ></option>
- </select>
- </div>
- <div class="field_wrapper reg_forname form-group field_wrapper_center_align">
- <label class="form_label1 ">Forename:<span style="color:red">*</span></label><br/>
- <input name="firstName" th:field="*{firstName}" class="form_fields " type="text" id="forename" />
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align" >
- <label class="form_label1">Surname:<span style="color:red">*</span></label><br/>
- <input name="surname" th:field="*{lastName}" type="text" id="surname" class="form_fields"/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Email:<span style="color:red">*</span></label><br/>
- <input name="email" th:field="*{email}" type="text" id="email" class="required email form_fields"/>
- <span id="emailValidator" class="please_do"></span>
- </div>
- <div class="field_wrapper hideDivOnDuplicateEmail form-group field_wrapper_center_align">
- <label class="form_label1">Date of Birth:<span style="color:red">*</span></label><br/>
- <input type="text" id="datepicker" th:field="*{dob}" class="select_mini form_fields" size="30" readonly="true" />
- </div>
- <div class="field_wrapper hideDivOnDuplicateEmail form-group field_wrapper_center_align">
- <label class="form_label1">Gender:</label><br/>
- <select id="gender" th:field="*{gender}" class="form_fields">
- <option th:each="entry2 : ${genderList.entrySet()}" th:value="${entry2.value}" th:text="${entry2.key}" ></option>
- </select>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1 hideOnDuplicateEmail">Telephone - Landline:</label><br/>
- <input name="landline" th:field="*{telephone}" class="form_fields" type="tel" id="landline-number" />
- <div id="valid-msg-landline" class="hide">✓ Valid</div>
- <div id="error-msg-landline" class="hide">Invalid number</div>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Telephone - Mobile:</label><br/>
- <input name="mobile" th:field="*{mobile}" type="tel" id="mobile-number" class="form_fields "/>
- <div id="valid-msg-mobile" class="hide">✓ Valid</div>
- <div id="error-msg-mobile" class="hide">Invalid number</div>
- </div>
- </div>
- <div class="content_area_center">
- <!--<h1 class="heading_beneficiary" align="center">Automatic Address Lookup</h1>
- <p class="content_subheading" align="center">Enter your 'United Kingdom postcode' and click the 'Search' button</p>-->
- <h1 class="heading_beneficiary" align="center">Address</h1>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Country:</label><br/>
- <select id="sendingCountry" th:field="*{countryId}" class="form_fields" onchange="showHideGBGroupValidation();">
- <option th:each="entry3 : ${countryList.entrySet()}" th:value="${entry3.key}" th:text="${entry3.value}" ></option>
- </select>
- </div>
- <div id="postcodeuk" class="field_wrapper form-group field_wrapper_center_align" style="display:block;">
- <label class="form_label1">Post code:<span style="color:red">*</span></label><br/>
- <input id="senderPostalCodeId" class="form_fields_new" placeholder="B33 8TH" th:field="*{postCode}" type="text" aria-required="true" aria-invalid="false" aria-describedby="senderPostalCodeId-error"/>
- <input type="button" class="submit_btn btn-margin" id="lookUpAddress" onclick="window.lookupUkAddress.lookupAddress();" value="Search" />
- <span id="senderPostalCodeId-error" class="help-block help-block-error"></span>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Street:</label><br/>
- <input name="street" th:field="*{street}" id="street" type="text" class="form_fields" onKeyPress='enterToSearch(event);'/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Town:</label><br/>
- <input name="town" id="town" th:field="*{town}" type="text" class="form_fields" onKeyPress='enterToSearch(event);'/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Building Number:</label><br/>
- <input name="buildingNumber" th:field="*{buildingNumber}" id="buildingNumber" type="text" class="form_fields" onKeyPress='enterToSearch(event);'/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Building Name:</label> <br/>
- <input name="buildingName" id="buildingName" th:field="*{buildingName}" class="form_fields" type="text" onKeyPress='enterToSearch(event);'/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Region:</label><br/>
- <input name="province" th:field="*{region}" id="province" type="text" class="form_fields" onKeyPress='enterToSearch(event);'/>
- </div>
- </div>
- <div class="content_area_center">
- <h1 class="heading_beneficiary" align="center">Passport Details</h1>
- <div id="passportDiv" class="hideDivOnDuplicateEmail">
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Upload Document:</label><br/>
- <div class="main-file-input">
- <input type='file' class="input-invisible"/>
- <div class="file-upload">
- To attach files/image, Drag and Drop Here or Just Click Here
- </div>
- </div>
- <div class="title-loaded-file"></div>
- <img class="delete-img-file" hidden="true" th:src="@{/resources/images/delete-img-file.png}"/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1 ">Country of issue:<span style="color:red">*</span></label><br/>
- <select id="issuedCountry" th:field="*{passportCountryId}" class="select_field form_fields" onchange="PPMasking.init()">
- <option value="">--Select Country of Issue--</option>
- <option th:each="countryBean : ${ppIssueCtryLst}" th:value="${countryBean.id}" th:text="${countryBean.countryName}" th:attr="data-masking=${countryBean.countryMasking}"></option>
- </select>
- </div>
- <div class="field_wrapper field_wrapper_center_align">
- <img th:src="@{/resources/images/online/uk_passport.jpg}" alt="UK Specimin Passport" width="280px"/>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Passport Number:<span style="color:red">*</span></label><br/>
- <input name="passportNumber" type="text" th:field="*{passportNumber}" class="form_fields_large hideOnDuplicateEmail passport_fields" id="passportNumber" /><br/>
- <span class="please_do" style="color:grey">Please enter your passport number as highlighted above.</span>
- <span class="please_do" id="passportAvailability"></span>
- </div>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Passport Issue Date:</label><br/>
- <input name="passportIssue" id="passportIssue" th:field="*{passportIssueDate}" class="form_fields hideOnDuplicateEmail" type="text" readonly="true"/>
- </div>
- <!--OTHER DOCUMENTS-->
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1">Passport Expiry Date:<span style="color:red">*</span></label><br/>
- <input name="passportExpiry" id="passportExpiry" th:field="*{passportExpiryDate}" class="hideOnDuplicateEmail form_fields" readonly="true"/>
- </div>
- <div class="other-documents" hidden="true">
- <h1 class="heading_beneficiary" align="center">Proof of Address</h1>
- <div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <div class="buttonGroup">
- <div class="main-file-input">
- <input type='file' class="input-invisible"/>
- <div class="file-upload">
- To attach files/image, Drag and Drop Here or Just Click Here
- </div>
- </div>
- <div class="title-loaded-file"></div>
- <img class="delete-img-file" hidden="true" th:src="@{/resources/images/delete-img-file.png}"/>
- </div>
- <input type="button" class="submit_btn" id='removeButton' value="Remove"/>
- </div>
- </div>
- </div>
- <div class="field_wrapper form-group field_wrapper_center_align">
- <input type="button" class="submit_btn btn-add-new-doc" id="addFileOtherDocuments" value="Add Proof Document"/>
- </div>
- <!--content area left
- <div class="content_area_left">-->
- <div class="field_wrapper hideDivOnDuplicateEmail field_wrapper_center_align">
- <label class="form_label1">How did you hear about us?</label><br/>
- <textarea name="heardAboutUs" class="form_fields hideOnDuplicateEmail" th:field="*{notes}" cols="50" rows="2" style="height:60px;"></textarea>
- </div>
- <!--</div>
- <div class="content_area_right ">-->
- <div class="field_wrapper form-group field_wrapper_center_align">
- <label class="form_label1 user-type">Customer Type:<span style="color:red">*</span></label><br/>
- <ul style="padding-left: 0px;">
- <li style="list-style: none;">
- <input class="cb_reg radio_mini require-one" id="cb14" type="checkbox" th:field="*{trading}" th:value="*{trading}"/>
- <label for="cb14" style="font-size: 14px;">Trading Customer</label>
- </li>
- <li style="list-style: none;">
- <input class="cb_reg radio_mini require-one" id="cb15" type="checkbox" th:field="*{prepaid}" th:value="*{prepaid}"/>
- <label for="cb15" style="font-size: 14px;">Prepaid Customer</label>
- </li>
- </ul>
- <div id="currBox" style="display:none">
- <ul style="padding-left: 0px;">
- <li th:each="list : ${servCurrList}" style="list-style: none;">
- <input type="checkbox" th:field="*{currencies}" th:value="${list.id}" />
- <label th:text="${list.currency}" style="font-size: 14px;">Heating</label>
- </li>
- </ul>
- </div>
- </div>
- <div class="field_wrapper field_wrapper_center_align">
- <input type="submit" name="register" value="Register" id="register" class="submit_btn" />
- </div>
- </div>
- </div>
- </div>
- </div>
- </form> <!--form Ends Here-->
- </div>
- <!-- footer area -->
- <div th:replace="footer :: footer"></div>
- </div>
- </div>
- <script th:src="@{/resources/js/online/jquery.js}"></script>
- <script th:src="@{/resources/js/online/jquery-ui.js}"></script>
- <script th:src="@{/resources/js/online/utils.js}"></script>
- <script th:src="@{/resources/js/online/modernizr.custom.js}"></script>
- <script th:src="@{/resources/js/online/intlTelInput.js}"></script>
- <script th:src="@{/resources/js/online/jquery.maskedinput.js}"></script>
- <script th:src="@{/resources/js/online/jquery.validate.min.js}"></script>
- <script th:src="@{/resources/js/online/additional-methods.min.js}"></script>
- <script th:src="@{/resources/js/online/dropzone.js}"></script>
- <script th:src="@{/resources/js/online/lookupAddressSender.js}" ></script>
- <script th:src="@{/resources/js/internal/int_date_picker.js}" ></script>
- <script th:src="@{/resources/js/internal/int_file_uploader.js}" ></script>
- <script th:src="@{/resources/js/internal/int_input_masking.js}" ></script>
- <script th:src="@{/resources/js/internal/int_intlTelInput.js}" ></script>
- <script th:src="@{/resources/js/internal/common.js}" ></script>
- <script th:src="@{/resources/js/internal/form-validation.js}" ></script>
- <script th:src="@{/resources/FileUpload/script.js}" ></script>
- <!-- <script th:src="@{/resources/js/online/svgcheckbx.js}"></script> -->
- <script type="text/javascript" th:inline="javascript">
- /* <![CDATA[ */
- var telInputMobile = $("#mobile-number"), telInputLandline = $("#landline-number"), errorMsgLandline = $("#error-msg-landline"), validMsgLandline = $("#valid-msg-landline"),
- errorMsgMobile = $("#error-msg-mobile"), validMsgMobile = $("#valid-msg-mobile");
- IntNumbValidation.init(telInputMobile, errorMsgMobile, validMsgMobile);
- IntNumbValidation.init(telInputLandline, errorMsgLandline, validMsgLandline);
- $(document).ready(function() {
- var availableTags = [ ];
- $( "#senderPostalCodeId" ).autocomplete({
- source: availableTags,
- minLength: 0,
- dataType: 'json'
- });
- FormValidation.init();
- DropZone.init();
- DatePickerRegister.init();
- // PPMasking.init();
- $("#passportNumber").focus(function(){
- var val = this.value; //store the value of the element
- this.value = ''; //clear the value of the element
- this.value = val;
- });
- $("#cb15").click(function(){
- $('#currBox').toggle();
- });
- var countryText = "United Kingdom";
- $("#sendingCountry option:contains(" + countryText + ")").attr('selected', 'selected');
- //$("#issuedCountry option:contains(" + countryText + ")").attr('selected', 'selected');
- /*
- var fileUploadOtherDocuments =
- "<div class='field_wrapper form-group field_wrapper_center_align'>" +
- "<label class='form_label1'>Upload Document:</label><br/> " +
- "<div class='buttonGroup'> " +
- "<label> Select the type of document <br/> " +
- "<select class='document-selection'><option>Driver License</option></select> " +
- "</label>" +
- "<div class='main-file-input'> " +
- "<input type='file' class='input-invisible'/> " +
- "<div class='file-upload'>To attach files/image, Drag and Drop Here or Just Click Here" +
- "</div>" +
- "</div>" + "<div class='title-loaded-file'></div><img class='delete-img-file' hidden='false' src='/SmartPayxOnline/resources/images/delete-img-file.png'/>" +
- "</div>" +
- "<input type='button' class='submit_btn' id='removeButton' value='Remove'/>" +
- "</div>";
- var contentOtherDocument1 = "<div class='field_wrapper form-group field_wrapper_center_align'> <label class='form_label1'>Country of issue:<span style='color:red'>*</span></label><br/> <select id='issuedCountry' id='passportCountryId' name='passportCountryId' class='select_field form_fields' onchange='PPMasking.init()'> <option>--Select Country of Issue--</option> <option th:each='countryBean : ${ppIssueCtryLst}' th:value='${countryBean.id}' th:text='${countryBean.countryName}' th:attr='data-masking=${countryBean.countryMasking}'></option> </select> </div>";
- var contentOtherDocument2 = "<div class='field_wrapper form-group field_wrapper_center_align'> <label class='form_label1'>Document Number:<span style='color:red'>*</span></label><br/> <input name='passportNumber' type='text' th:field='*{passportNumber}' class='form_fields_large hideOnDuplicateEmail passport_fields' id='passportNumber' /><br/> <span class='please_do' style='color:grey'>Please enter your passport number as highlighted above.</span> <span class='please_do' id='passportAvailability' ></span> </div>";
- var contentOtherDocument3 = "<div class='field_wrapper form-group field_wrapper_center_align'> <label class='form_label1'> Issue By:</label><br/> <input name='passportIssue' id='passportIssue' th:field='*{passportIssueDate}' class='form_fields hideOnDuplicateEmail' type='text' readonly='true'/> </div>";
- var contentOtherDocument4 = "<div class='field_wrapper form-group field_wrapper_center_align'> <label class='form_label1'>Document Expiry Date:<span style='color:red'>*</span></label><br/> <input name='passportExpiry' id='passportExpiry' th:field='*{passportExpiryDate}' class='hideOnDuplicateEmail form_fields' readonly='true'/> </div>";*/
- /*$('#addFileOtherDocuments').click(function() {
- $('.other-documents').append($('<div>' + fileUploadOtherDocuments + contentOtherDocument1 + contentOtherDocument2 + contentOtherDocument3 + contentOtherDocument4 + '</div>').css({opacity: 0}).animate({opacity: 1}, 1500));
- });*/
- $(document).on('click', '#removeButton', function() {
- $(this).parent().parent().parent().attr('hidden', true);
- $('#addFileOtherDocuments').attr('hidden', false);
- $(this).parent().find('.input-invisible').val('');
- $(this).parent().find('.delete-img-file').attr('hidden', true);
- $(this).parent().find('.file-upload').text('To attach files/image, Drag and Drop Here or Just Click Here');
- $(this).parent().find('.title-loaded-file').removeClass('imgLoadInf').attr('hidden', true);
- });
- $( document).on( 'change', '.input-invisible', function(e){
- var splittedFakePath = this.value.split('\\');
- $(this).parent().next().text(splittedFakePath[splittedFakePath.length - 1]).css('background', '#eaf0f6').addClass('imgLoadInf');
- $(this).next().text('File Successfully Added!');
- $(this).parent().next().next().attr('hidden', false);
- });
- $(document).on('click', '.delete-img-file', function(e) {
- $(this).prev().prev().children('.input-invisible').val('');
- $(this).attr('hidden', true);
- $(this).prev().removeClass('imgLoadInf').attr('hidden', true);
- $(this).prev().prev().children('.file-upload').text('To attach files/image, Drag and Drop Here or Just Click Here');
- });
- $(document).on('mouseenter', '.input-invisible', function() {
- $(this).next().css('background', '#acaaaa');
- });
- $(document).on('mouseleave', '.input-invisible', function() {
- $(this).next().css('background', '#678dbb');
- });
- $('#addFileOtherDocuments').click(function () {
- $(this).parent().prev().attr('hidden', false);
- $(this).attr('hidden', true);
- })
- });
- /* ]]> */
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement