It seems to me that what you want to do is to treat JS file like JSP file and resolve its contents via spring:message tag.

I would not do that.

Typically JS i18n is done in one of two ways:

• By writing out Array of translated strings from JSP page


• By creating translation filter and provide pre-translated JS file to requesting client

Both works best if you create one central location for your client-side translatable strings.

In your context, I would recommend the first method (much easier). That is unless your project is pretty large and you have a lot of translatable strings on the client side. So the modification would look like:

<script type=text/javascript>

  var strings = new Array();

  strings['settings.toogle'] = <spring:message code='proj.settings.toggle' javaScriptEscape='true' />;

  strings['settings.toogle.description'] = <spring:message code='proj.settings.toggle.description' javaScriptEscape='true' />;

</script>

<spring:theme code=jsFile var=js />

<script type=text/javascript src=${js} />

And in your JS file:

buildList('settings', [{

    name: strings['settings.toggle'],

    id:setting1,

    description: strings['settings.toggle.description'],

    installed: true

}]);

Mind you that I used double quotes for writing out translated strings. That is because of some words in French or Italian that could contain apostrophe.

Edit: Additional input

We provide translations to JS files for the reason. Usually, the reason is we want to create some part of UI dynamically. There are also cases where we need to localize some 3rd party component, my answer above deals with them pretty well.

For cases where we want to create UI parts dynamically, it really make sense to use templates rather than concatenate HTML tags in JavaScript. I decided to write this, because it makes for much cleaner (and possibly reusable) solution.

So instead of passing translations to JavaScript one may create a template and put it on the page (my example will use Handlebars.js, but I believe it is possible to use any other engine):

<script id=article type=text/x-handlebars-template>

  <div class=head>

    <p>

      <span>

        <spring:message code=article.subject.header text=Subject:  />

      </span>{{subject}}</p>

  </div>

  <div class=body>

    {{{body}}}

  </div>

</script>

On the client side (that is in JavaScript) all you have to do is to access the template (example below obviously uses jQuery) and compile:

var template = Handlebars.compile($(#article).html());

var html = template({subject: It is really clean,

  body: <p>Don't you agree?</p><p>It looks much better than usual spaghetti with JavaScript variables.</p>

});

$(#someDOMReference).html(html);

Few things to note here:

• <spring:message /> tags escape both HTML and JS by default, we do not need to specify the javaScriptEscape attribute


• It make sense to provide text attribute for <spring:message /> tag as it could be used as a fall-back (if there is no translation for given language) as well as a comment (what this element stands for). One can even create a tool that would scan files for <spring:message /> tags and automatically generate properties files


• To prevent Handlebars from escaping HTML contents, I used triple {{{curly braces}}}

That's basically it. I recommend using templates if that's possible.