#Jack_chai

1 messages · Page 1 of 1 (latest)

blazing spadeBOT
patent agate
#

Happy to help if that's integration/coding question

flint patio
#

hi mate

#

first one, has any one got issue with element.on('change', function..) not triggered as expect ?

#

this.elements = this.stripe.elements(options);
this.paymentElement = this.elements.create("payment", this.paymentElementOptions);
this.paymentElement.mount(#${elementId});

            this.paymentElement.on('change', function(event) {
                const countryCode = (document.getElementById("Field-countryInput") as HTMLInputElement);
                alert('test ' + countryCode + '?');
                if (event.complete) {
                    alert('complete ' + countryCode + '?');
                }
            });
#

from what I tested, it only fired couple first times and then just not triggered
another question, how can I get that billing country , i need to re-caculate gst based on country similar to what we have for low code integration

patent agate
#

In my integration it fires all the time.

#

I don't think you can get the element directly inside the PaymentElement

#

were you able to do so?

flint patio
#

it returns null

patent agate
#

Yes, because it's inside a secure iframe. It's expected that you can't get by document.getElementById

flint patio
#

i guess, no way we can get that country value

patent agate
# 
  paymentElement.on('change', function(ev){
    console.log('changed');
    console.log(ev);
  })

If you do this you will see everything collectable

flint patio
#

do u hv example project element integrate with vueJS?

#

because the event we got it doesnt hv the value we need
it looks like this

unknown.png
#

{ collapsed: false,
completed: false,
elementType: "payment",
empty: true
value: {type: card}}

patent agate
#

Yep I am seeing the same. Unfortunately this callback doesn't return anything more than that :/

#

I would suggest taking a step back, what do you want to do with the country, each time the PaymentElement is changed? What is gst?

flint patio
#

gst is tax value based on country

#

basically ,we building custom checkout similar to Stripe checkout (lowcode integration) because thats Stripe checkout does not support prebilling yet
then we try to stripe element and replicate features from Stripe checkout such as, promocode apply, recalculate tax based on country

patent agate
#

Yes you are right that Checkout is compatible with StripeTax, but PaymentElement isn't (or isn't with one-off payment) PaymentElement requires a pre-created PaymentIntent with a specified amount, and its flow is fundamentally different than Checkout.

#

But StripeTax is compatible with with Invoice/Subscription. So if that's not one-off transactions, you can setup StripeTax on Invoice/Subscription (via Customer) then take the Invoice/Subscription's PaymentIntent's secret to feed into PaymentElement

#

Sorry if you are hitting a corner here

flint patio
patent agate
flint patio
#

oki, will try to re-read this again

flint patio
#

and do u hv any suggestion, how to allow user to use existing payment method to pay from custom checkout?

patent agate
#

by "custom checkout" do you mean Payment Elements? No PaymentElements doesn't display the user saved Payment Method :/

#

I know it's a feature requests by other users too and we have some plan working on it

flint patio
#

hmm..we call payment menthod to show existing card with masked number
same as stripe chekcout session, but then what to do next when user click paynow
we will just update the created subscription with payment Id (sent from frontend) and how to charge customer?

#

is there any flow /document for this one?

patent agate
#

we call payment menthod to show existing card with masked number
To clarify you built this yourself, right? At the time of displaying masked number, you should have the Payment Method Ids (pm_xxx) I assume

#

Then you can just update the Subscription with the customer-selected payment method id, and the customer id

patent agate
#

👋 I am stepping down for the day. If you have follow up questions feel free to ask in the channel