AEM i18n from Javascript (try 2) | Community
Skip to main content
daitienshi
daitienshi
Level 2
November 1, 2016

AEM i18n from Javascript (try 2)

  • November 1, 2016
  • 6 replies
  • 15995 views

Apologies for the duplicate post. Seems like something in the original is breaking the page, so I'll try this again:

I'm trying to dynamically retrieve a translated message using Javascript from my created dictionary in AEM's translator (/libs/cq/i18n/translator.html).

We've got dictionary values set up like:

String               EN                  FR
========================================================
TEST-001        This is a Test1     FR:This is a Test1
TEST-002        This is a Test2     FR:This is a Test2
TEST-003        This is a Test3     FR:This is a Test3

I've looked through the Internationalizing UI Strings article (https://docs.adobe.com/docs/en/aem/6-2/develop/components/i18n/i18n-dev.html) but when I try to the following:

Granite.I18n.setLocale("en");
Granite.I18n.get("TEST-001");
or

Granite.I18n.setLocale("fr");
Granite.I18n.get("TEST-001");


I only get returned the string I've passed in (i.e. "TEST-001").

Could someone help me understand how to retrieve the translated value back?

Thanks!

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

6 replies

L
Adobe Employee
lreis1Adobe Employee
Adobe Employee
November 1, 2016

I'm not sure about the relationship between "String" and "EN" here, as the English string is typically the key. What do you get if you do:

Granite.I18n.setLocale("fr");
Granite.I18n.get("This is a Test1");

daitienshi
daitienshiAuthor
Level 2
November 1, 2016

Hi Leandro,

The relationship between String and EN is based on the translator library found in /libs/cq/i18n/translator.html.

The String value is normally used as the lookup key in JSP or Sling and the EN is the actual translated value being returned if the locale is EN.

Regardless, if I pass the "This is a Test1" string into the Granite.I18n.get() function, with the locale set to FR, I still get back "This is a Test1"

Anton_Smulskiy
Anton_Smulskiy
Level 3
November 1, 2016

Have you checked if your i18n works on JSP/Java? If it works there - I have no answer.

If not - make sure use set your dictionary correctly under /apps/your-app/i18n. 

Also, your page should be under /content/your-app/...

daitienshi
daitienshiAuthor
Level 2
November 1, 2016
Hi Anton, Yes, I'm able to successfully use i18n using JSP, but we're looking to dynamically retrieve the string via javascript rather than preloading the string on page render.
Anton_Smulskiy
Anton_Smulskiy
Level 3
November 1, 2016
  • Try to remove "-" from i18n key name.
  • Try to use CQ.I18n
  • Debug
-
Adobe Employee
-Joe-Adobe Employee
Adobe Employee
November 2, 2016

Hi,

Do you see any errors from your browser?

The Javascript implementation will need to retrieve the dictionary as JSON via an Ajax request. You should see a request to something like /libs/cq/i18n/dict.fr.json.

Can you check this url returns the expected information?

daitienshi
daitienshiAuthor
Level 2
November 2, 2016
Hi Joseph, How would I request the dictionary via AJAX? I can call Granite.I18n.getDictionary() and get an object back but I have no clue what this object is (have tried a bunch of the functions it has defined) but still can't get anything out of it.
S
shiva76076
April 12, 2021

Hope this might help someone looking for solution.

 

This has worked for me:

var pageLang = new java.util.Locale(currentPage.getLanguage(false).getLanguage());
var resourceBundle = request.getResourceBundle(pageLang);
var i18n = new com.day.cq.i18n.I18n(resourceBundle);

 

i18n.get("String that needs to be translated")

Terms & ConditionsAccessibility statement

Loading footer...