Subversion Repositories web.creative

<div style="display: none;" class="payment-warning alert alert-danger">
  <i class="fa fa-exclamation-circle"></i>
  <span class="message"></span>
</div>
<form class="form-horizontal" id="payment">
  <div class="form-group required">
    <label class="col-sm-2 control-label" for="input-holder">{{ entry_holder }}</label>
    <div class="col-sm-10">
    <input type="text" autocomplete="off" autocorrect="off" autocapitalize="none" spellcheck="false" maxlength="32" name="holder" placeholder="{{ entry_holder }}" id="input-holder" class="form-control" />
    </div>
  </div>
  <div class="form-group required">
    <label class="col-sm-2 control-label" for="input-pan">{{ entry_pan }}</label>
    <div class="col-sm-10">
    <input type="text" autocomplete="off" autocorrect="off" autocapitalize="none" spellcheck="false" maxlength="19" name="pan" placeholder="{{ entry_pan }}" id="input-pan" class="form-control" />
    </div>
  </div>
  <div id="expiry-date-group" class="form-group required">
    <label class="col-sm-2 control-label">{{ entry_expires }}</label>
    <div class="col-sm-3">
      <select name="exp_month" class="form-control">
       {% for month in months %}
        <option value="{{ month.value }}">{{ month.text }}</option>
        {% endfor %}
      </select>
    </div>
    <div class="col-sm-3">
      <select name="exp_year" class="form-control">
       {% for year in years %}
        <option value="{{ year.value }}">{{ year.text }}</option>
        {% endfor %}>
      </select>
    </div>
  </div>
  <div class="form-group required">
    <label class="col-sm-2 control-label" for="input-cvc">{{ entry_cvc }}</label>
    <div class="col-sm-10">
    <input type="text" autocomplete="off" autocorrect="off" autocapitalize="none" spellcheck="false" maxlength="4" name="cvc" placeholder="{{ entry_cvc }}" id="input-cvc" class="form-control" />
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-1 col-sm-offset-2">
      <input id="button-confirm" type="button" value="{{ button_confirm }}" class="btn btn-primary" />
    </div>
  </div>
</form>
<div id="cardinity-3ds"></div>
<script type="text/javascript"><!--
$('#button-confirm').on('click', function() {
  $.ajax({
    url: 'index.php?route=extension/payment/cardinity/send',
    type: 'post',
    data: $('#payment :input'),
    dataType: 'json',
    beforeSend: function() {
      $('.payment-warning').hide();

      $('.payment-warning .message').text();

      $('#payment').find('*').removeClass('has-error');

      $('#button-confirm').button('loading').attr('disabled', true);
    },
    complete: function() {
      $('#button-confirm').button('reset');
    },
    success: function(json) {
      if (json['error']) {
        if (json['error']['warning']) {
          $('.payment-warning').show();

          $('.payment-warning .message').text(json['error']['warning']);
        }

        if (json['error']['holder']) {
          $('#input-holder').closest('.form-group').addClass('has-error');
        }

        if (json['error']['pan']) {
          $('#input-pan').closest('.form-group').addClass('has-error');
        }

        if (json['error']['expiry_date']) {
          $('#expiry-date-group').addClass('has-error');
        }

        if (json['error']['cvc']) {
          $('#input-cvc').closest('.form-group').addClass('has-error');
        }
      }

      if (json['3ds']) {
        $.ajax({
          url: 'index.php?route=extension/payment/cardinity/threeDSecureForm',
          type: 'post',
          data: json['3ds'],
          dataType: 'html',
          success: function(html) {
            $('#cardinity-3ds').html(html);
          }
        });
      }

      if (json['redirect']) {
        location = json['redirect'];
      }
    }
  });
});
//--></script>