Advertise with us

Apache Cordova- Globalization

The globalization plugin is used for getting info about user’s local language, date and time zone, currency etc. this could be necessary in order to enhance the user’s experience.

The following steps are to be followed:

Step 1 - Install Globalization Plugin

Install the plugin by typing the following code in command prompt window.

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-globalization
 Step 2 - Adding Buttons

You can add four buttons to index.html file to call different methods that will be created later.

<button id = "Language">LANGUAGE</button>

<button id = "LocaleName">LOCALE NAME</button>
<button id = "Date">DATE</button>
<button id = "Currency">CURRENCY</button>


Step 3 - Adding Event Listeners

To ensure that our app and Cordova are loaded before we start using it, event listeners should be added in index.js file inside getDeviceReady function.

document.getElementById("Language").addEventListener("click", Language);

document.getElementById("LocaleName").addEventListener("click", LocaleName);
document.getElementById("Date").addEventListener("click", Date);
document.getElementById("Currency").addEventListener("click", Currency);

 Step 4.1 – Create Language Function

First you have to add a function in index.js. function that returns BCP 47 language tag of the user’s device.

We will use getPreferredLanguage method.The function has  two parameters onSuccess and onError.

function Language() {

   navigator.globalization.getPreferredLanguage(onSuccess, onError);
   function onSuccess(language) {
      alert('language: ' + language.value + '\n');
   function onError(){
      alert('Error getting language');

 when we press LANGUAGE button, the alert message box will be displayed on the screen.

Apache Cordova- Globalization

Step 4.2 - Create Locale Function

The function will return BCP 47 tag for the user’s locale settings. This is similar to the previously created function. The only difference is that we are using LocaleName method this time.

function LocaleName() {

   navigator.globalization.getLocaleName(onSuccess, onError);
   function onSuccess(locale) {
      alert('locale: ' + locale.value);
   function onError(){
      alert('Error getting locale');



Once we click on LOCALE button, the alert box will display our locale tag.

Apache Cordova- Globalization

Step 4.3 – Create Date Function

This function will return the current date according to user’s locale and time zone settings. 

date parameter is the current date and options parameter is optional.

function Date() {

   var date = new Date();
   var options = {
      selector:'date and time'
   navigator.globalization.dateToString(date, onSuccess, onError, options);
   function onSuccess(date) {
      alert('date: ' + date.value);
   function onError(){
      alert('Error getting dateString');    }


Now, when you run the app and press DATE button you will see the current date.

Apache Cordova- Globalization

The last function that we will create will return the currency values according to the user’s device settings and ISO 4217 currency code.

function Currency() {

   var currencyCode = 'EUR';
   navigator.globalization.getCurrencyPattern(currencyCode, onSuccess, onError);    function onSuccess(pattern) {
      alert('pattern: ' + pattern.pattern + '\n' +
         'code: ' + pattern.code + '\n' +
         'fraction: ' + pattern.fraction + '\n' +
         'rounding: ' + pattern.rounding + '\n' +
         'decimal: ' + pattern.decimal + '\n' +
         'grouping: ' + pattern.grouping);
   function onError(){
      alert('Error getting pattern');

 When you click the CURRENCY button, it  will display the alert box showing users currency pattern.

Apache Cordova- Globalization

This plugin offers other methodsalso, that are listed below in the table:





onSuccess, onError

Returns client's current language.


onSuccess, onError

Returns client's current locale settings.


date, onSuccess, onError, options

Returns date according to client's locale and timezone.


dateString, onSuccess, onError, options

Parses a date according to client's settings.


currencyCode, onSuccess, onError

Returns client's currency pattern.


onSuccess, onError, options

Returns client's date pattern.


onSuccess, onError, options

Returns an array of names of the months, weeks or days according to client's settings.


date, successCallback, errorCallback

Used to determine if the daylight saving time is active according to client's time zone and calendar.


onSuccess, onError

gives the first day of the week according to user’s settings.


number, onSuccess, onError, options

Returns number according to client's settings.


string, onSuccess, onError, options

Parses a number according to client's settings.


onSuccess, onError, options

Returns the number pattern according to client's settings.


Read Our Previous posts: Handling Events in App Built Using Apache Cordova

Cordova- plugman

Last updated:3/19/2018 3:21:56 AM


Leave Comment