bourax webmaster bourax webmaster - 4 months ago 14
Javascript Question

set language for customised Stripe form

I have a Stripe payment form in a multilanguages site. With the simple form I can set the language by : data-locale="" (which is 2 letters ; EN or DE,...) in :

<script src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="my_key_blablabl"
data-image="images/home/cart.png" // your company Logo
data-name="company_name"
data-email="<?= $loggedInUser->email ?>"
data-description="banana"
data-locale="<?= $language ?>"
data-currency="EUR"
data-amount="100">
</script>


but when I use the customised form, I don't know how and where to set the language value :
here is my script :
My HTML

<form action="" method="POST" id="payment-form">
<span class="payment-errors"></span>
<input type="text" size="20" data-stripe="number">
<input type="text" size="2" data-stripe="exp_month">
<input type="text" size="2" data-stripe="exp_year">
<input type="text" size="4" data-stripe="cvc">
<input type="text" size="6" data-stripe="address_zip">
<input type="submit" class="submit" value="Submit Payment">
</form>

<script type="text/javascript" src="https://js.stripe.com/v2/"></script>
<script type="text/javascript">
Stripe.setPublishableKey('my_key_blablabl');
$(function() {
var $form = $('#payment-form');
$form.submit(function(event) {
// Disable the submit button to prevent repeated clicks:
$form.find('.submit').prop('disabled', true);
// Request a token from Stripe:
Stripe.card.createToken($form, stripeResponseHandler)
// Prevent the form from being submitted:
return false;
});
});
</script>

Answer

You can use a message array :

 var errorMessages = {
            incorrect_number: "<?= $language['incorrect_number'] ?>",
            invalid_number: "<?= $language['invalid_number'] ?>.",
            invalid_expiry_month: "<?= $language['invalid_expiry_month'] ?>",
            invalid_expiry_year: "<?= $language['invalid_expiry_year'] ?>",
            invalid_cvc: "<?= $language['invalid_cvc'] ?>",
            expired_card: "<?= $language['expired_card'] ?>",
            incorrect_cvc: "<?= $language['incorrect_cvc'] ?>",
            incorrect_zip: "<?= $language['incorrect_zip'] ?>",
            card_declined: "<?= $language['card_declined'] ?>",
            missing: "<?= $language['missing'] ?>",
            processing_error: "<?= $language['processing_error'] ?>",
            rate_limit:  "<?= $language['rate_limit'] ?>"
        };
        if (response.error) {
            $form.find('.payment-errors').text(errorMessages[ response.error.code ] );

See all the errors here

Comments