Seeking assistance in setting up localization for a web application with JavaScript and JSON integration

I'm currently working on setting up a web application that needs to be able to use client-side JavaScript for localization, especially since it will need to function offline. In order to achieve this, I have created a function and a JSON array within my JavaScript code:

var l10n = {
    "getMessage": function(msg) {
        return locales.en.msg;
    }
}

along with

var locales = {
    "en": {
        "applicationName": "This is the application name!",
        "msg": "Looks like we've gotta problem."
    }
}

However, when I input 

l10n.getMessage("applicationName")
, the script consistently returns the "msg" string ("Looks like we've gotta problem." which was included there for troubleshooting purposes).

The issue appears to stem from my l10n.getMessage() function. Despite its potential simplicity in terms of resolution, my limited knowledge of JavaScript prevents me from determining how to rectify it. Any suggestions on the best approach for correcting this so that it can display the proper message for the specified string?

Your assistance is greatly appreciated!

javascriptjsonlocalizationoffline

Answer №1

Indeed, the solution is quite straightforward. Simply utilize bracket notation to access a property from an object using a variable:

var language = {
    "getTranslation": function(phrase) {
        return dictionary.english[phrase];
    }
};

See it in action: http://jsfiddle.net/wC4PN/

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Rearrange Firebase data on the client side

Having trouble sorting data in Firebase for a web project. I tried using orderByChild to filter the data, but now I need to also order it by date. Here's what I've attempted: Tried using object.values with .sort, no luck Attempted to use lodas ...

javascriptfirebasefirebase-realtime-database

Establishing a fresh domain in Keycloak via the utilization of a downloaded realm JSON file within the Keycloak platform

Hello, I am currently working on a project that involves creating a realm in Keycloak using a REST API. Here are the steps I have taken so far: Called an API ${process.env.KEYCLOAK_BASEURL}/admin/realms, and passed the following body data: { "id& ...

node.jsjsonkeycloakkeycloak-rest-api

ES6: Using DataURI to provide input results in undefined output

In my current project, I am facing a challenge. I am attempting to pass image dataURI as an input from a url link to the image. To achieve this task, I know that I have to utilize canvas and convert it from there. However, since this process involves an &a ...

javascriptasynchronousecmascript-6data-uri

DiscordjsError: The client attempted to use a token that was not accessible

Hey there, I'm currently working on implementing a bot for my server and encountered an issue while attempting to create a member counter for voice channels. After completing the setup, I ran node index.js in the terminal, only to receive an error ind ...

javascriptnode.jsdiscorddiscord.js

JSON data retrieved from a Java program containing various values

I need to send a JSON string to a server following this syntax: "id":"00", "action":"register", "get_value":"true", "values":{ "user":"Jack", "password":"Jhonson", "id":"123456" } }; I am struggling with how ...

javaandroidjsonhttp

Surprising results from implementing the useLocation() hook in a React application

Currently, I am embarking on a personal endeavor to create an online auction platform. One of the key functionalities I am working on is rendering detailed product information when a user clicks on a specific product for purchase. Initially, everything wor ...

javascriptnode.jsreactjsexpress

Printing in Firefox is ineffective, but functions smoothly in alternative browsers

I'm currently working on customizing some content specifically for printing, so I've implemented a hook import { useState } from 'react' const usePrint = () => { const [isPrinting, setIsPrinting] = useState(false) const hand ...

javascriptreactjsfirefox

Display text when hovered over or clicked to insert into an HTML table

I have an HTML table connected with a component field gameArray and I need it to: Show 'H' when the user's cursor hovers over TD (:hover) and the corresponding field in gameArray is an empty string, Fill the gameArray field after a click. ...

javascripthtmlangulartypescriptangularjs-directive

Issue with JQuery UI Tabs not displaying additional HTML pages in JavaScript

One issue I'm facing is that I added Tabs from JQuery UI on my website. The tab containing paragraphs loads fine, but the tabs linked to other HTML pages (which don't have tabs) won't load. Here is my .js file code and .html code: $(funct ...

javascriptjqueryjquery-ui

Tips for animating AngularStrap Collapse

My AngularStrap navbar collapse is functioning well, but the collapsing process lacks animation. Despite injecting the ngAnimate library and including the data-animation='am-collapse' attribute in my bs-collapse directive, I seem to have missed s ...

javascriptangularjstwitter-bootstrapng-animateangular-strap

Encountered an issue loading the file or assembly netwonsoft.json following recent updates to Visual Studio and NuGet

Recently, I updated Visual Studio to update 4 before updating all packages through NuGet. However, upon attempting to run my website, I encountered the following error: An exception of type 'System.IO.FileLoadException' occurred in mscorlib.dll ...

c#jsonjson.netnugetlog4net

Creating dynamic ColumnDefs for UI Grid is essential for responsive and flexible data

I am currently facing a challenge with my angular UI Grid setup for populating data in reports. With almost 20 reports to handle, I am looking to streamline the process by using one UI Grid for all of them. To achieve this, I am attempting to dynamically c ...

javascriptangularjsangularjs-scope

Trigger a function in AngularJS when a div is scrolled to within a specific number of pixels from the bottom of the screen

I am experimenting with the AngularJS infinite-scroll directive. Below is the code snippet: angular.module('infiniteScroll', []) .directive('infiniteScroll', [ "$window", function ($window) { return { link:funct ...

javascripthtmlangularjsangularjs-directiveinfinite-scroll

Strategies for dynamically altering Vue component props using JavaScript

for instance: <body> <div id="app"> <ro-weview id="wv" src="http://google.com"></ro-weview> </div> <script> (function () { Vue.component("ro-webview", { props: ["src"], template: ` <input type="t ...

javascriptvue.js

Update object properties in Angular controller dynamically

Take a look at my simple plunker Within the code, I am attempting to link a scope variable to an object property. $scope.name = 'World'; var obj = { "name":$scope.name } $scope.$watch('name', function(){ console.log(obj["name"]); ...

javascriptangularjs

Combine values from a JSON string using a line break

I'm having an issue with my JSON array where each element is not printing on a new line as intended. I attempted to use '/n' and space characters for this purpose but it's not working correctly. String json = null; // Splitting the coo ...

javaarraysjsonnewline

broadcast a video file from a Node.js server to multiple HTML5 clients at the same time

After researching online, I have been looking for a way to simultaneously stream a video.mp4 to multiple html5 clients. Despite reading various tutorials, I haven't found the ideal solution using nodejs. Do you have any suggestions or alternative met ...

javascriptnode.jshtmlvideonpm

Optimal method for Python to engage with MySQL databases

As a beginner in programming, I am currently teaching myself the correct ways of coding. My current project involves writing a script in Python that will receive 1-3 values every second and save them to a MySQL database. Eventually, I plan on creating a we ...

pythonmysqljsonhttpget

What could be causing my Angular Ngrx app's state not to render properly on the application?

Is there a way to automatically render the state when the app loads without having to click a button? I am currently facing an issue where the state is empty until I manually trigger the click function by pressing a button. I have tried using this.store.se ...

javascriptangularngrx

Use Node and Express with JavaScript to store HTML form data in JSON format within a .json file

Just starting out with node and express. I am capturing user input from an HTML form and attempting to append or push it in a .json file. I tried using the jsonfile npm package but the data is not being stored in an array format in the JSON file. Here is ...

javascriptjsonnode.jsexpresspush