PaymentRequest: shippingaddresschange event

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

The shippingaddresschange event is sent to the PaymentRequest object when the user selects a shipping address or changes details of their shipping address.

This event is not cancelable and does not bubble.

Syntax

Use the event name in methods like addEventListener(), or set an event handler property.

js
addEventListener("shippingaddresschange", (event) => { })

onshippingaddresschange = (event) => { }

Event type

A PaymentRequestUpdateEvent. Inherits from Event.

Event PaymentRequestUpdateEvent

Event properties

Provides only the properties inherited from Event.

Usage notes

Depending on the browser, the shipping address information may be redacted for privacy reasons. That is, the PaymentAddress which contains the shipping address may have some portions of its content altered, obscured, or left out entirely in order to prevent identifying the user without their consent (since if they choose to have you ship products to them, you'll need their address).

Example

In this example, a handler for the shippingaddresschange event is set up to validate that the address meets requirements set by the web application.

js
const paymentRequest = new PaymentRequest(methodData, details, options);

paymentRequest.addEventListener("shippingaddresschange", (event) => {
  const detailsUpdate = checkAddress(paymentRequest.shippingAddress);
  event.updateWith(detailsUpdate);
});

function checkAddress(theAddress) {
  const detailsUpdate = {};

  // Check the address, return an object with any changes or errors.

  return detailsUpdate;
}

You can also establish a handler for shippingaddresschange using the onshippingaddresschange event handler property:

js
paymentRequest.onshippingaddresschange = (event) => {
  const detailsUpdate = checkAddress(paymentRequest.shippingAddress);
  event.updateWith(detailsUpdate);
};

Browser compatibility

desktop mobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
shippingaddresschange event
Deprecated Non-standard
Chrome – Full support
Chrome 60 (Release date: 2017-07-25)
footnote Full support
Edge – Full support
Edge 15 (Release date: 2017-04-05)
footnote Full support
Firefox – No support
Firefox 55 (Release date: 2017-08-08)
disabled
disabled From version 55 users must explicitly set the dom.payments.request.enabled preference to true. To change preferences in Firefox, visit about:config.
Opera – Full support
Opera 47 (Release date: 2017-08-09)
footnote Full support
Safari – Full support
Safari 11.1 (Release date: 2018-04-12)
footnote Full support
Chrome Android – Full support
Chrome Android 53 (Release date: 2016-09-07)
footnote Full support
Firefox for Android – No support
Firefox for Android
footnote No support
Opera Android – Full support
Opera Android 44 (Release date: 2017-12-11)
footnote Full support
Safari on iOS – Full support
Safari on iOS 11.3 (Release date: 2018-03-29)
footnote Full support
Samsung Internet – Full support
Samsung Internet 6 (Release date: 2017-08-23)
footnote Full support
WebView Android – Full support
WebView Android 136 (Release date: 2025-04-29)
footnote Full support
WebView on iOS – Full support
WebView on iOS 11.3 (Release date: 2018-03-29)
footnote Full support

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Non-standard. Check cross-browser support before using.
Deprecated. Not for use in new websites.
User must explicitly enable this feature.