Detect shipping country change event on checkout

[kristinam]

Hi, I have created a checkout extension to add a new custom field on checkout. Now I need to show or hid that field based on shipping country in checkout. How can I detect shipping country change event within new checkout extensibility functions?

[jamalali81]

Try this:

export default extension('your.extension.target', (root, api) => {
  api.shippingAddress.subscribe(() =>
    yourMethodToHandleChange()
  );
});

May I ask how you added the custom field and where exactly you added it?

Do you know how to dynamically update address fields. I have tried this but noting seems to be happening:

await api.applyShippingAddressChange({
  type: 'updateShippingAddress',
  address: {
    zip: myNewZip
  }
});

[Liam]

If this is a cart/checkout validation function, you should be able to read the countryCode.

If you're working with extensions, there’s auseShippingAddress()method that returns the shipping address, with country included.

[Zobekdev]

Hi Liam, i'm a little confused, how i can detect when the user write something in the input field, it's possible in the checkout extensibility api? i been reviewed all the hooks and i can't found something useful for this case.

[LuckyLuc]

Hi, I am stuck with the same issue. I would like to know if there is an event that triggers when the address changes.
Can you provide a simple example please?

Thanks

[Schmidtc63]

export default extension(
    `purchase.checkout.shipping-option-list.render-before`,
    async (root, api) => {
        const {shippingAddress} = api;
        let currentShippingCountry=shippingAddress.current.countryCode;
        shippingAddress.subscribe(async (newShippingAddress) => {
            if (currentShippingCountry !== newShippingAddress.countryCode) {
               currentShippingCountry = newShippingAddress.countryCode;
               // do what you need to do
            }
        });
});

[LuckyLuc]

Hi, do you have an example for detecting when the "Billing" address changes ? 
I tried changing shippingAddress to billingAddress in your code but it's not working for some reason

thanks for your help

[LuckyLuc]

Nevermind! It Works!!! 

guess I needed to refresh something or the browser had to update. 

Anyway, thanks Schmidtc63 !! You Rock!! 🙂

[Schmidtc63]

Did you ever get this figured out?