Localize javascript messages and validation text

Question

I am working on a multilingual web project. For example, one part of the project includes some kind of google user mapping, which uses client-side interaction, using jquery / .net to add points to the map and store them in the database.

There will be some checks and other informational messages (for example, "add at least one point on the map") that must be localized.

The only options I can think of now:

• Use javascript code rendering block to pull localized message from resource file

• Use hidden fields with meta: resourcekey to automatically capture the corresponding localized message from the resource file using the current culture and get the .val () value in jquery if necessary.

• Make a webservice call to get the correct key / language message every time a message is required.

Any thoughts, experiences?

EDIT:

I would prefer to use .net resource files to maintain compatibility with the rest of the application.

Answer 1

Ok, I created a generic web service to allow me to grab resources and return them in a dictionary (perhaps the best way to convert to a dictionary) ...

<WebMethod()> _ <ScriptMethod(ResponseFormat:=ResponseFormat.Json, UseHttpGet:=False, XmlSerializeString:=True)> _ Public Function GetResources(ByVal resourceFileName As String, ByVal culture As String) As Dictionary(Of String, String) Dim reader As New System.Resources.ResXResourceReader(String.Format(Server.MapPath("/App_GlobalResources/{0}.{1}.resx"), resourceFileName, culture)) If reader IsNot Nothing Then Dim d As New Dictionary(Of String, String) Dim enumerator As System.Collections.IDictionaryEnumerator = reader.GetEnumerator() While enumerator.MoveNext d.Add(enumerator.Key, enumerator.Value) End While Return d End If Return Nothing End Function 

Then I can get this json result and assign it to a local variable:

 // load resources $.ajax({ type: "POST", url: "mapping.asmx/GetResources", contentType: "application/json; charset=utf-8", dataType: "json", data: '{"resourceFileName":"common","culture":"en-CA"}', cache: true, async: false, success: function(data) { localizations = data.d; } }); 

Then you can grab your value from a local variable as follows:

localizations.Key1

The only catch here is that if you want to assign localizations to a global variable, you must run it async = false, otherwise you will not have translations available when you need them. I am trying to use "get", so I can cache the answer, but it does not work for me. See this question:

Unable to return dictionary (Of String, String) via GET ajax web request, works with POST

Answer 2

I have done this before when there are hidden fields that have values ​​set to Page_Init () and Page_Load (), with corresponding values ​​from global and local resource files. Then javascript code will work with these hidden values.

Code for

 this.hfInvalidCheckDateMessage.Value = this.GetLocalResourceObject("DatesRequired").ToString(); 

Page.aspx

 $('#<%= btnSearch.ClientID %>').click(function(e) { if (!RequiredFieldCheck()) { var message = $("#<%= hfInvalidCheckDateMessage.ClientID %>").val(); alert(message); e.preventDefault(); $("#<%= txtAuthDateFrom.ClientID %>").focus(); } }); 

Disclaimer ... Not sure if this was the best route or not, but it works well.

Answer 3

I have implemented a modified version of the solution described here: http://madskristensen.net/post/Localize-text-in-JavaScript-files-in-ASPNET.aspx

I changed it to allow multiple resource file names, if necessary, by changing the regular expression and using the HttpContext.GetGlobalResourceObject method to extract the resource string.

Answer 4

I use this technique. This makes it easy for anyone with little coding experience to edit the phrase of a JavaScript file.

 var lang = 0 // 0 = english, 1 = french var phrases=[] phrases["plans"] = "Rate Plans and Features|Forfaits et options").split("|") 

then you output it as:

 phrases["plans"][lang] 

... add more columns if necessary.