Menu
is any i18n localization plugin for Jquery Mobile? I searched a lot of time, but i18n translations plugins for Jquery not working correctly on JQM. For example in a href..many thanks.
Nobody knows?
807
I have had the same problem, and I resolved the problem simply by using the Jquery Extend function.
Say you define your language resources as follows:
1) Create a resource file with the default localization, presumably defined in English. Let's call it resources.default.js
var MyApp = MyApp || {};
MyApp.resources = {
One: "One",
Two: "Two",
Three:"Three"
}
2) Define your localized resources in independent files, let's say Spanish. Call it resources.es.js
var localizedResources = {
One: "Uno",
Two: "Dos",
Three:"Tres"
}
3) On your server logic, decide that you need to include only the default translations in case of English, or if you need any other language do an include.
<script src="resources.es.js"> </script>
4) Create your web page, and add scripts to handle your inclusion of the resources, per step 3.
<html>
<head>
</head>
<body>
<h1>Welcome to my App</h1>
<p>Welcome to this test app</p>
<button>Click me</button>
<script src="resources.default.js"> </script>
// The server decided we needed Spanish translations.
<script src="resources.es.js"> </script>
<script type="text/javascript">
//Extend the translations into the resources object.
$.extend(MyApp.resources, localizedResources);
$(window).ready(function(){
$('button').click(function(){
alert(MyApp.resources.One);
});
});
</script>
</body>
This should work for you. EDIT: See it in action here: http://jsfiddle.net/agarcian/rrDv3/1/
149
I'm using the following script for my projects. It allows you to change the language "at runtime", without reloading the page. The script is "autorun", just add it at the end of the html page. It could have some bugs ;)
// AutoStar!
// Grab the parameters from my url, and initialize myself! FUGOOOOO
(function __lang_init_wrapper()
{
var scriptSrc = $('script[src*=Lang]').attr('src');
var myParams = parseParams(scriptSrc);
new Lang(myParams.language.toUpperCase(), true);
})();
/**
* Thanks to: http://wowmotty.blogspot.com/2010/04/get-parameters-from-your-script-tag.html
* @param n
* @param s
*/
function gup(n,s){
n = n.replace(/[\[]/,"\\[").replace(/[\]]/,"\\]");
var p = (new RegExp("[\\?&]"+n+"=([^&#]*)")).exec(s);
return (p===null) ? "" : p[1];
}
/**
*
* @param language The language to use
* @param replaceText If true, replace all the occurency marked with placemark {lang=<key>}
*/
function Lang(language, replaceText)
{
var Languages =
{
ENG:
{
ok: 'ok'
,yes: 'yes'
,no: 'no'
,unknown_user: 'Unknown user'
,too_soon: "It's not time, yet..!"
}
,ITA:
{
yes: 'si'
,unknown_user: 'Utente sconosciuto'
,too_soon: "Pazienta ancora un po'..!"
}
}
// GENERAL SETTINGS
var LANG_CURRENT = language;
var LANG_DEFAULT = 'ENG';
/**
* All the html elements with this attributes are translated on the fly
*/
var LANG_ATTRIBUTE_NAME = "uilang"
/**
* key è la chiave da usare nell'oggetto LANG
* @param key
*/
this.get = function(key)
{
return Languages[LANG_CURRENT][key] || Languages[LANG_DEFAULT][key];
}
/**
* Cerco tutti gli elementi che hanno una certa classe
*/
this.searchAndReplace = function()
{
var me = this;
var divs = $('*[' + LANG_ATTRIBUTE_NAME + ']');
$.each(divs,function(indx,item)
{
item = $(item);
item.text(me.get(item.attr(LANG_ATTRIBUTE_NAME)));
});
}
this.setLanguage = function(language, replaceText)
{
LANG_CURRENT = language;
if(replaceText){
this.searchAndReplace();
}
}
if(replaceText){
this.searchAndReplace();
}
// Returns a localized instance of language
Lang = {
get: this.get
,searchAndReplace: this.searchAndReplace
,setLanguage: this.setLanguage
};
}
TO use it, just "mark" an html element
<h1 uilang="unknown_user"></h1>
or call
Lang.get('unknown_user')
to get the localized string
To initialize, call the "constructor"
new Lang("ITA", true);
To use it specifyng a language,
<script type="text/javascript" src="js/Lang.js?language=ita"></script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
