B4J Question Localize a Web App

[luke2012]

Hi to all,
how to localize a Web App using B4J ?
I have to handle 4 or 5 languages.

 

[Erel]

You need to describe your project. Where do the strings come from? Static html files?

 

[luke2012]

You need to describe your project. Where do the strings come from? Static html files?

I'm developing a page using jquery ui as default navigation (tabs) and HTML5 as layout.

see : http://jqueryui.com/tabs/
I'm using also : http://jqueryui.com/accordion/

My target is to let the user to choose the language at the first run of the web app.

 

[Erel]

Is the text currently embedded in your app B4J code?

 

[luke2012]

Is the text currently embedded in your app B4J code?

All the text is within the web page.

 

[rwblinn]

Hi,

an option is to use a json file with arrays. each array holding a language.
In the html files assign for each control to be localized an ID.
In the B4J webapp read the language information from the json file and set the text to the controls jqueryelement = depending on the language selected.
Pls find attached B4J HOWTO example. When running, click on the localize button and the language will switch accordingly.

 

[luke2012]

Hi,

an option is to use a json file with arrays. each array holding a language.
In the html files assign for each control to be localized an ID.
In the B4J webapp read the language information from the json file and set the text to the controls jqueryelement = depending on the language selected.
Pls find attached B4J HOWTO example. When running, click on the localize button and the language will switch accordingly.

I take a look at the project!
Thanks!

 

[luke2012]

Hi,

an option is to use a json file with arrays. each array holding a language.
In the html files assign for each control to be localized an ID.
In the B4J webapp read the language information from the json file and set the text to the controls jqueryelement = depending on the language selected.
Pls find attached B4J HOWTO example. When running, click on the localize button and the language will switch accordingly.

Only a doubt.
I'm implementing my Web App front-end using jquery & jquery UI libraries.
My target is to do a web app in order to run on windows, mac & linux machines.

I see that you are using jQuery mobile within your WebApp localize project.
If I integrate your code within my web app I got jQuery UI code & jQuery mobile code that coexist.

Could it introduce issues ?

 

[rwblinn]

Hi,

you can adopt the principle of my example code in your jquery ui code, if you want to stick to a pure jquery ui solution.

I tend to use jquery mobile ui with additional plugins only - to avoid any potential conflicts between jquery ui and jquery mobile ui.
jquery mobile ui supports win, mac, linux, raspberry clients etc. so far have made good experience. keep the client ui simple is key.

Let me know your experience as well,

 

[luke2012]

My experience with jquery mobile is good!
How to read the selected value of a fieldset tag?

           <form>
            <fieldset data-role="controlgroup" data-type="vertical">
               <legend>Choose your language:</legend>
               <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2a" value="on" checked="checked">
               <label for="radio-choice-h-2a">English</label>
               <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2b" value="off">
               <label for="radio-choice-h-2b">Italian</label>
               <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2c" value="other">
               <label for="radio-choice-h-2c">Spanish</label>
               <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2d" value="other">
               <label for="radio-choice-h-2d">French</label>
               <input type="radio" name="radio-choice-h-2" id="radio-choice-h-2e" value="other">
               <label for="radio-choice-h-2e">German</label>
            </fieldset>
           </form>

 

[rwblinn]

Hi Luke,

Private radio-choice-h-2a As JQueryElement

Get the status:
Read the property checked which returns true or false.

radio-choice-h-2a.GetProp("checked").Value

Get the value:

radio-choice-h-2a.GetVal.Value

 

[luke2012]

Private radio-choice-h-2a As JQueryElement

I got an error : "Input string is not in a correct format"

 

[rwblinn]

Hi,

do not use the minus sign. Instead:

Private radiochoiceh2a As JQueryElement

Ensure to update the FXML file also.