Displaying read-only AddressBook and Wallet widgets

After the buyer has chosen a shipping address and payment method from the Amazon Pay widgets, you can render read-only versions of the AddressBook and Wallet widgets to give the buyer one last chance to review their choices before confirming their purchase.

Show the read-only versions of the widgets using the same code that originally rendered the widgets on your site. Add the displayMode: 'Read' parameter to the code.

Make sure that you put the parameter amazonOrderReferenceId instead of creating a new OrderReferenceObject in the widgets, as you probably did in at least one of the non-read-only widgets that you integrated previously.

 
<!--Place this code in your webpage -->

<div id="readOnlyAddressBookWidgetDiv"></div>
 
<div id="readOnlyWalletWidgetDiv"></div>

<script>
  new OffAmazonPayments.Widgets.AddressBook({
    sellerId: 'YOUR_SELLER_ID_HERE',
    amazonOrderReferenceId: 'YOUR_AMAZON_ORDER_REFERENCE_ID',
    // amazonOrderReferenceId obtained from Address widget
    displayMode: 'Read',
    design: {
      designMode: 'responsive'
    },
    onError: function(error) {
      // your error handling code
    }
  }).bind('readOnlyAddressBookWidgetDiv');
</script>

<script>
  new OffAmazonPayments.Widgets.Wallet({
    sellerId: 'YOUR_SELLER_ID_HERE',
    amazonOrderReferenceId: 'YOUR_AMAZON_ORDER_REFERENCE_ID',  
    // amazonOrderReferenceId obtained from Address widget
    displayMode: 'Read',
    design: {
      designMode: 'responsive'
    },
    onError: function(error) {
     // your error handling code
    }
  }).bind('readOnlyWalletWidgetDiv');
</script>
    

If you need to show the read-only widget on the same page as the editable AddressBook or Wallet widgets, subscribe to the onAddressSelect or onPaymentSelect notifications, and redraw the read-only widget at that time. Otherwise, the read-only widget will not show the correct information.