Dynamics Community Forum Thread Details

Add Javascript on Preference center for multi-lingual field text change based on OptionSet

HI Team,

I want to understand how can we add javascript on Preference Center in Customer Insight Journey for OnChanges event of Optionset field to update the other fields label in form

for example, I have default English value in OptionSet and all my fields are also in english language. I want to update it in Arabic then onchange of the optionset, it should update all the text label of form and show that form in Arabic.

Please provide for any supporting blogs or Microsoft link as well. Thanks

Categories:

Dynamics 365 Customer Insights - Journeys

Microsoft Dynamics CRM

Good morning, afternoon, or evening—depending on where you are in the world!
Hope you're doing well.

Currently, Customer Insights - Journeys does not natively support JavaScript injection or advanced scripting directly within the Preference Center UI. This limits the ability to use onChange events on OptionSet fields to dynamically update label text across the form.

What’s Possible (and Not):

JavaScript customization is not officially supported in the hosted Preference Center pages.
The Preference Center is rendered as a managed Power Pages site, and while you can customize layout and styling using CSS, dynamic behavior like label switching based on OptionSet values is not exposed through the standard configuration [1] [2].

Workarounds:

Use Power Pages with Custom JavaScript:
- If you're using a custom Power Pages site to host your Preference Center, you can inject JavaScript to listen for OptionSet changes and update labels accordingly.
- Example:
  document.getElementById("languageOptionSet").addEventListener("change", function(e) {
       const selectedLang = e.target.value;
       if (selectedLang === "Arabic") {
           document.getElementById("label1").innerText = "الاسم";
           document.getElementById("label2").innerText = "البريد الإلكتروني";
       } else {
           document.getElementById("label1").innerText = "Name";
           document.getElementById("label2").innerText = "Email";
       }
  });
- This assumes you have control over the HTML IDs and structure, which is only possible in a custom-hosted version.
Use Multiple Forms:
- Create separate forms for each language and use the OptionSet to redirect users to the appropriate version. This is more static but avoids unsupported scripting.
Submit Feedback to Microsoft:
- This is a common multilingual use case. If you're working within the out-of-the-box Preference Center, consider submitting feedback or a feature request via the Dynamics Ideas portal.