Update the configuration
Rebilly Instruments provides a method to update the current configuration. All properties of the configuration can be updated.
This example describes how to update the locale option programmatically from English to Spanish. Use these principles to change any property of the configuration.
This topic assumes that you have already completed one of the Get started guides, and are looking to customize or extend the functionality.
Update the DOM
Create the button
Add a button with an id of update-locale to your HTML file.
Update the options
Attach a click handler to change the locale.
Mount Instruments
Your existing instruments mount code remain unchanged.
Track the current locale
Create a variable to track the locale change.
Handle the button click
Add a click handler to the locale update button.
Determine the new locale
Use localeChanged to determine the new locale, and update the button text.
Update Rebilly Instruments
Use the update() method to update the configuration and re-render the User Interface (UI).
Any property of the mount options may be updated.
For more information, see RebillyInstrument.update().
- index.html
- index.js
1<!doctype html>2<html lang="en">3 <head>4 <script src="https://cdn.rebilly.com/instruments/@latest/core.js" type="text/javascript"></script>5 <script src="./index.js" type="text/javascript" defer></script>6 </head>7 <body>8 <button id="update-locale">Update locale to Spanish</button>9 <div class="rebilly-instruments-summary"></div>10 <div class="rebilly-instruments"></div>11 </body>12</html>1RebillyInstruments.mount({2 organizationId: "test-org-2019-12-07",3 publishableKey: "pk_sandbox_WcUZLs3xwB7dubewna3zJA75wdMBEHeWHOyQww8",4 websiteId: "example",5 apiMode: "sandbox",6 items: [7 {8 planId: "rebilly-e-book",9 quantity: 1,10 },11 ],12});1314let localeChanged = false;1516const updateLocaleButton = document.querySelector("#update-locale");17updateLocaleButton.addEventListener("click", async () => {18 localeChanged = !localeChanged;19 const updatedLocale = localeChanged ? "es" : "en";20 updateLocaleButton.textContent = localeChanged ? "Update Locale to English" : "Update Locale to Spanish";2122 await RebillyInstruments.update({23 locale: updatedLocale,24 });25});