<div class="pagseguro-container">
  <div class="right">

	<?php if ($captcha_tpl) { ?>
		<div class="flex middle-xs end-xs bottom-margin-large">
		<?php  echo $captcha_tpl; ?>
		</div>
	<?php } ?>

	<button type="button" id="button-confirm" class="btn-default btn-large">
		<span><?php echo $button_confirm; ?></span>
	</button>

  </div>
</div>

<script type="text/javascript"><!--
window.waitEvent('scripts_document', function(){
$('#button-confirm').bind('click', function() {

    var data = $('.pagseguro-container').find('select, textarea, input').serialize();
  	$.ajax({
  		type: 'post',
      	data : data,
      	dataType : 'json',
  		url: 'index.php?route=payment/pagseguro/confirm',
			beforeSend: function() {
				$('#button-confirm').addClass('btn-loading');
			},
			success: function(json) {
				$('.form-error').remove();
				if (!json['error']){
					window.location = '<?php echo $continue; ?>';
				}else{
					$.each(json['error'], function (index, value) {
						$('input[name=' + index + ']').after('<span class="text-small text-error visible-block text-margin-x-small form-error">' + value + '</span>');
            if (index == 'g-recaptcha'){
              $('#' + index).parent().after('<span class="text-small text-error visible-block text-margin-x-small form-error">' + value + '</span>');
            }
					});
					$('#button-confirm').removeClass('btn-loading');
				}
			},
			error: function() {
				console.log('erro no pagamento');
				$('#button-confirm').removeClass('btn-loading');
			}
  	});

});
});
//--></script>
