hello this my code is not working internet explorer plz give me solution

[gulfam143]

hello this my code is not working internet explorer plz give me solution

/**
 * When we click on a card
 */
 $('#btnpay').click(function(){
  const paymentRequest = {
    cardNumber:  $('#cartno').val(),
    expYear: $('#expYear').val(),
    expMonth: $('#expMonth').val(), 
    cvc: $('#cvcno').val(),
    currency: 'GBP', 
    amount: $('#amount').val(),
    nativeElement: document.querySelector('#iframe-payment')
  };
  
  paymentRequest.nativeElement.innerHTML = 'Loading... Please wait... while you are redirecting payment getway ';
$('.frm').hide()
  doPayment(paymentRequest).then((result) => {
$('#formpay').append('<input type="hidden" name="stripeSource" value="'+result.id+'" />');
$('#formpay').submit()

  }).catch((error) => {

    paymentRequest.nativeElement.innerHTML = 'Ups! We can\t validate your details...';
    
	setTimeout(function() {
      location.reload();
      }, 3000);
  });
})



  function isNumberKey(evt){
	
    var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57))
	return false;
	

	
}


$('#cartno').keyup(function() {
  var length = $(this).val().length;

  if(length==16){
	
	  $('#expMonth').focus()
  }
  
});

$('#expMonth').keyup(function() {
  var length = $(this).val().length;
var firstChar = $(this).val().substr(0, 1);
if(firstChar>1){
$(this).val(0)}
  if(length==2){
$('#expYear').focus()
  }
  

  
  
});


$('#expYear').keyup(function() {
  var length = $(this).val().length;

  if(length==2){
$('#cvcno').focus()
  }
  
});


$('#cvcno').keyup(function() {
  var length = $(this).val().length;

  if(length==3){
$('#btnpay').focus()
  }
  
});

[gits]

what exactly is not working?

[gulfam143]

trigger is not working on internet explorer
error on this line doPayment(payme ntRequest).then ((result) => {
plz giving me right solution

[gits]

which version of IE is it? i suspect that it doesnt support promises so you would need to include some code to polyfill the promise-construct or u can use babel to transpile the code.

[gulfam143]

this code not working on IE 11 version please give me any solution

[gits]

i gave you 2 possible hints to solve that issue - u can use babel for transpiling or use something like this:

https://github.com/taylorhakes/promise-polyfill

note: this is just an example - there are many more such implementations that can be used.

[gulfam143]

i used babel but i get other error 'Promise' is undefined in api file



this file

/**
 * This is the main function - The only one that we should call from outside this file
 */
function doPayment(paymentRequest) {
  return new Promise((resolve, reject) => {
    const onCreateCardCallback = create3DSecure(paymentRequest, resolve, reject);
    return Stripe.source.create({
      type: 'card',
      card: {
        number: paymentRequest.cardNumber,
        cvc: paymentRequest.cvc,
        exp_month: paymentRequest.expMonth,
        exp_year: paymentRequest.expYear
      }
    }, onCreateCardCallback);
  });
}

function create3DSecure(paymentRequest, resolve, reject) {
  return (status, cardResponse) => {


    if (status !== 200 || cardResponse.error) {  // problem
      reject(cardResponse.error);
    } else if (cardResponse.card.three_d_secure === 'not_supported' && cardResponse.status === 'chargeable') {
      resolve(cardResponse);
    } else if(cardResponse.card.three_d_secure === 'optional' || cardResponse.card.three_d_secure === 'required') {
      const onCreate3DSecureCallback = createIframe(paymentRequest, resolve, reject);

      Stripe.source.create({
        type: 'three_d_secure',
        amount: paymentRequest.amount,
        currency: paymentRequest.currency,
        three_d_secure: { card: cardResponse.id },
        redirect: { return_url:'demo.com'}
      }, onCreate3DSecureCallback);
    }
    else {
      reject(cardResponse);
    }
  };
}

function createIframe(paymentRequest, resolve, reject) {
  return (status, stripe3dsResponse) => {

    if (status !== 200 || stripe3dsResponse.error) {  // problem
      reject(stripe3dsResponse.error);
    } else {
      paymentRequest.nativeElement.innerHTML =
        '<iframe style="width:100%; height:622px;" frameborder="0" src="' + stripe3dsResponse.redirect.url + '"></iframe>';

      const onPollCallbackReal = onPollCallback(paymentRequest, resolve, reject);
      Stripe.source.poll(stripe3dsResponse.id, stripe3dsResponse.client_secret, onPollCallbackReal);
    }
  };
}

function onPollCallback(paymentRequest, resolve, reject) {
  return (status, source) => {
   

    if (status !== 200 || source.error) {
      
      reject(source.error);
    } else if (source.status === 'canceled' || source.status === 'consumed' || source.status === 'failed') {
      
      reject(source.status);
    } else if (source.three_d_secure.authenticated &&  source.status === 'chargeable') {
    
  
      resolve(source);
    }
  };
}

[gits]

this most likely means that the Browser doesnt know of a Promise object

[gulfam143]

what i do on this error please give me any solution thank you for helping to me

[gits]

there is a call:

new Promise

obviously that Object is not defined anywhere - so the browser doesnt know that object and u need some polyfill - either the babel one or another. for babel u can start checking here:

https://babeljs.io/docs/plugins/transform-runtime/