Form with tag and validation template

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.


Before body code ->

DOCS

*** IMPORTANT: For ALL form feilds do not check the "require" (should be false)
Redirect URL (under sumbit button):

https://www.bassetgold.co.uk/thank-you


form feilds names:

First Name => id = first-name, name = "first name"
Last Name => id = last-name, name = "last name"
Email => id = email, name = "email"
Phone => id = phone, name = "phone"


#id for Success/error divs:

Remove redirection (option)

Comment this line (under succsed function)


window.location.href=...

Summary





Before body custom code

"THE TAG"

control + f - find data += '&_LeadSourceData=<TAG_NAME>'; and change the var value (get the key from B & G Team)

Example:
data += '&_LeadSourceData=NLP_39MI_A_2018_04';

copy-paste this code + remember to change the tag value


<script>
  $('.w-form').removeClass('w-form');
  $( "form" ).submit(function( event ) {
    setNormalState();
    $('input:submit').attr('disabled', 'disabled');
    if(validateForm()) {
      validatePhone($('#phone').val());
    }
    event.preventDefault();
  });

  function validateForm() {
    $firstName = $('#first-name');
    // First name validations
    if($firstName.val() == '') {
      showError('First name field is required')
      return false;
    }
    if($firstName.val().length < 2) {
      showError('First name should have at least 2 characters')
      return false;
    }
    $lastName = $('#last-name');
    // First name validations
    if($lastName.val() == '') {
      showError('Last name field is required')
      return false;
    }
    if($lastName.val().length < 2) {
      showError('Last name should have at least 2 characters');
      return false;
    }
    return true;
  }

  function validatePhone(phone) {
    if(phone == '') {
      showError('Correct phone number is required');
      return false;
    }
    $.post('https://account-api.bassetgold.co.uk/client/validate/phone', {phone: phone}, validatePhoneCB);
  }

  function validatePhoneCB(res) {
    if(res.success) {
      if($('#message-2').val() == '') {
        showError('Message field is required')
        return false;
      }
      validateEmail($('#email').val());
    } else {
      showError('Correct phone number is required');
    }
  }

  function validateEmail(email) {
    if(email == '') {
      showError('Correct email is required');
      return false;
    }
    $.post('https://account-api.bassetgold.co.uk/client/validate/email', {email: email}, validateEmailCB);
  }

  function validateEmailCB(res) {
    if(res.success) {
      sendDataToServer();
    } else {
      showError('Correct email is required');
    }
  }

  function sendDataToServer() {
    var data = $('form').serialize();
    /* change tag value her */
    data += '&_LeadSourceData=<TAG_NAME>'; // TODO change TAG_NAME
    if(getCookie("affiliate_pid")) {
      data += '&afpid='+getCookie("affiliate_pid");
    }
    if(getCookie("utm_bg_product")) {
      data += '&utm_bg_product='+getCookie("utm_bg_product");
    }
    if(getCookie("utm_bg_campaign")) {
      data += '&utm_bg_campaign='+getCookie("utm_bg_campaign");
    }
    if(getCookie("utm_landing_page")) {
      data += '&utm_landing_page='+getCookie("utm_landing_page");
    }
    $.post('https://account-api.bassetgold.co.uk/client/infopack', data, success);
  }

  function success(res) {
    if(res.success) {
      window.location.href = "https://www.bassetgold.co.uk/thank-you"; // TODO comment it if no redirection
      $('form').hide();
      $('.w-form-done').show();
      $('input:submit').removeAttr('disabled');
    } else if(res.error && res.error[0]) {
      showError(res.error[0]);
    } else if(res.result.error == 'Infussion client already exists') {
      $('#email-form').hide();
      $('.w-form-done').show();
      $('input:submit').removeAttr('disabled');
    } else {
      showError(res.result.error);
    }
  }

  function showError(msg) {
    $('#error-div').html(msg);
    $('.w-form-fail').show();
    $('input:submit').removeAttr('disabled');
  }

  function setNormalState() {
    $('#email-form').show();
    $('.w-form-done').hide();
    $('.w-form-fail').hide();
  }
</script>