Skip to content

Support of multiple locales on the same page

Oleg Kiriljuk edited this page Mar 16, 2015 · 6 revisions

Introduction

The files grid.locale-XX.js from i18n folder contains translations of some texts which can be displayed by jqGrid and contains some locale/regional specific settings, like format of Date or integers. jqGrid 4.6/4.7 required that one such file are included on the page. Starting with version 4.4.2 till 4.7 it's allowed to include the second locale file, but the settings from the last included file full overwrite the declarations of the previous one.

In the old post I suggested how one can to implement settings of multiple locales without large changes of the main code of jqGrid, but the feature was not implemented.

Solution of the problem in free jqGrid 4.8

Free jqGrid 4.8 contains changes structure of all locale files grid.locale-XX.js. All locale specific settings are moved under $.jgrid.locales.LOCALE_NAME.. For example the file grid.locale-en.js defines the settings under $.jgrid.locales["en-US"]., grid.locale-de.js defines the settings under $.jgrid.locales.de. and the same settings one more time under $.jgrid.locales["de-DE"]. or $.jgrid.locales.de. and so on. Every grid.locale-XX.js defines new settings at least under one more sub-branch of $.jgrid.locales.. For example $.jgrid.errors.errcap can be found now under $.jgrid.locales["en-US"].errors.errcap or $.jgrid.locales.de.errors.errcap.

To access locale specific settings it's recommended to use getGridRes method. It allows to access to the final string setting with the code like

var $grid = $("#myGrid"),
    titleOfErrorDialog = $grid.jqGrid("getGridRes", "errors.errcap");

or one can get the object with subset of settings and then access the corresponding properties:

var $grid = $("#myGrid"), errorStrings = $grid.jqGrid("getGridRes", "errors"),
    titleOfErrorDialog = errorStrings.errcap;

Additionally every grid.locale-XX.js set/overwrite $.jgrid.defaults.locale which specifies default value of locale option of jqGrid. So if one don't include locale option it will be used the locale of the last included grid.locale-XX.js file. On the other side one can include on one page multiple locales like grid.locale-en.js, grid.locale-de.js and grid.locale-ru.js and use different locales for different grids/subgrids. As the result the subgrids could looks like on the picture below

multilang

See the demo