This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

General Questions /

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

Translatable Javascript

5 Posts 3393 Views

spierala

Community Member, 80 Posts

6 May 2010 at 10:03pm

Edited: 06/05/2010 10:04pm

Hello,

I try to make my javascript messages translatable, but it does not work.

I followed these instructions: http://doc.silverstripe.org/i18n?s=sprintf

I added this line to my Requirements in Page.php

Requirements::javascript(SAPPHIRE_DIR . "/javascript/i18n.js");

Then i added the language files in js-version e.g. en_GB.js containing following code:

if(typeof(ss) == 'undefined' || typeof(ss.i18n) == 'undefined') {
	console.error('Class ss.i18n not defined');
} else {
	ss.i18n.addDictionary('en_GB', {
		'FormContact.MYENTITY' : "Delete Article?"
	});
}

Then I try to test the code in the Page.ss template via:

<script type="text/javascript">
			alert(ss.i18n._t('FormContact.MYENTITY'));
</script>

But the alert is always empty. What went wrong?

Many thx,
Florian

//SS. 2.3.3

//PS: I would like to have a "Translatable" Section or something similar in the Forum :)

martimiz

Forum Moderator, 1391 Posts

6 May 2010 at 11:49pm

Edited: 06/05/2010 11:50pm

Hi,
I've been running this as well, and it looks to be far more complex then it should be.

1. Where did you place your en_GB.js language file? Supposing you put it in /mysite/lang/*.* you'd have to point SilverStripe to it in the init() method like:

Requirements::add_i18n_javascript('mysite/javascript/lang');

2. You need to provide a default en_US.js file at all times, so there's something to fall back to, if the correct current locale (en_GB) is not recognized

3. You should not hardcode the <script> tags in your template, since required scripts, like i18n.js, are loaded at the end of the page, so you want your customscript to be placed below that. In init():

Requirements::customScript("alert(ss.i18n._t('FormContact.MYENTITY'));");

By now you should see the en_US default translation :-)

4. i18n.js tries to find out what the current locale is, by interrogating the content-language metattag. If that is not set, it falls back to the default locale, that is 'en_US', so you need to have this in your page.

<meta http-equiv="Content-Language" content="en_GB" />

5. And this is the downfall: it still might not test OK... In my case i18n.js does find the correct locale - but only after the alert has fired. Timing... :-(

I do support your request for a section i18n and translatable (which are not necessarily the same) :-)

spierala

Community Member, 80 Posts

7 May 2010 at 5:02am

Oh nooo, sorry, i had my js files in the standard lang folder NOT in mysite/javascript/lang/ :(
Now everything works fine.

Requirements::add_i18n_javascript('mysite/javascript/lang');
is also important.

I just want to translate Form Validation Code. Therefore I have fortunately no timing problems.
Thanx for clarifying the topic.

florian

Pike

Community Member, 42 Posts

11 May 2010 at 1:30am

DO NOT FORGET ADD to page.php function init():

Requirements::insertHeadTags('<meta http-equiv="Content-language" content="' . i18n::get_locale() . '" />');

to header meta tags. Without that, javascript localization not works.

ryanwachtl

Community Member, 46 Posts

27 January 2013 at 6:54pm

Edited: 27/01/2013 6:55pm

In SilverStripe 3.0.x you can add a lang attribute to the body element and it will get picked up by the i18n JavaScript implementation. You may want to do it this way if you're using an HTML5 doctype and have already defined the locale within the lang attribute of the html element and don't want to use the, now obsolete, Content-Language meta element.

<body lang="$ContentLocale">

Return to top