Translating strings in JavaScript

Last updated on
18 June 2021

Drupal 7 will no longer be supported after January 5, 2025. Learn more and find resources for Drupal 7 sites

This documentation needs work. See "Help improve this page" in the sidebar.

The JavaScript library shipped with Drupal 6 includes ports of the t() and format_plural() functions, for formatting and translating strings that occur in your module and theme JavaScript code. The Drupal.t() and Drupal.formatPlural() functions work just like their PHP equivalents. They are also similar to their PHP counterparts in that you should use them with literal strings for all string arguments, both so that Drupal can pick the strings up for translation, and the translation template extractor can offer them for translation in templates.

All three types of placeholders, with identical escaping and theming, are available in both functions, so security is also taken care of. Examples of use:

var comments = Drupal.t('Comments');
var commentsOnType = Drupal.t('Comments to @type posts', {'@type': typeName});
var commentCount = Drupal.formatPlural(count, '1 comment', '@count comments');
var commentCountOnType = Drupal.formatPlural(count, '1 comment on @type posts', '@count comments on @type posts', {'@type': typeName});
// Starting from Drupal > 7.9, a context can be used.
// Change notice: [#1323152]
longMay = Drupal.t('May', {}, {context: "Long month name"});

The signatures of the two functions are Drupal.t = function(str, args) and Drupal.formatPlural = function(count, singular, plural, args). As you can see, unlike their PHP counterparts, the JavaScript functions do not allow for alternate language specification, since only the required strings are generated in the output page for use. Look into the source of drupal.js for more information on these functions.

Notes:

  1. For performance reasons, Drupal caches the JavaScript files it has parsed. So, when you add or change strings in a JavaScript file, you have to clear the cache to have Drupal pick up the new strings and make them available for translation.
  2. Automatic extraction does not work for packed JavaScript files. For this reason, module authors should only include unpacked versions of their JavaScript files. Drupal's JavaScript aggregator will create a packed version from these files anyway.
  3. Any object argument, when present, cannot be set to null since the parser only recognizes the empty object ({}) as a valid object.

In other words the first note (point 1) means that you can not put a parametric text into Drupal.t(), because Drupal, during the javascript files parsing stage would not recognize the string; use explicit string instead.

Take a look to the following examples.

// BAD.
var myvar = "Something to translate";
Drupal.t(myvar);

// GOOD - standard case.
var myvar = Drupal.t("Something to translate");

// GOOD - x variable assumes a value a priori unknown.
Drupal.t("My first string to translate");
Drupal.t("My second string to translate");
Drupal.t("My third string to translate");

var x;

/**
*  x variable becomes one of the strings,
*  we don't know which
**/

var myvar = Drupal.t(x);

Help improve this page

Page status: Needs work

You can: