Error message i18nextJquery.init is not a function about jquery-i18next HOT 17 CLOSED

@jonalxh yes i18next is the core with all the functionality -> jquery-i18next is just a convenience addon to use it with jquery.

No there is no such sample i guess - but you can easily combine https://jsfiddle.net/jamuhl/ferfywyf/#tabs=js,result,html with the above sample

from jquery-i18next.

i18next/i18next-jquery is itself exported as UMD. so if you use AMD you should just require it instead of trying to access window.i18nextJquery

from jquery-i18next.

Actually I am accessing it as a dependent module. and I am able to reach i18next-jquery.min.js. from my module. However there is no init function in i18nextJquery module. Even I could not find it in i18next-jquery.min.js.

define([ 'jquery', 'i18nextJquery', 'i18next'],function ( $, i18nextJquery, i18next){

initi18nJQuery()

function initi18nJQuery() {
console.log("From initi18nJQuery..." + i18nextJquery);
let i18nextInstance = i18next.createInstance();
i18nextJquery.init(i18next, $);

}
}

from jquery-i18next.

my fault...exported the init function and not an object having init function. try now with v0.0.4

from jquery-i18next.

Thanks for your quick fix. This is now working if I use i18nextJquery/bin/index.js but not from i18next-jquery.min.js.

Now in our app there is one Index.html which is loaded during application start (via grunt). Before using V2,. initializing the i18next from apps.js was sufficient to translate the i18n-data from index.html.

div class="welcome" data-i18n="login.index-WelcomeMsg"></div
input data-i18n="[placeholder]login.index-labelUser" /// not translating
-button ... data-i18n="login.button"> //not translating

However I am wondering where from should I call this localize function.
I have initialized the i18next with options...
then initialized i18nextJquery with i18next instance. like this
i18nextJquery.init(i18next, $);
$(".welcome").localize(); - -- now its not able to find any key that I have used in Index.html. However the handlebars templates are working fine.

from jquery-i18next.

ok point 1) is fixed in 0.0.5 i18next-jquery.min.js should work now.

using handlebars you should not need i18next-jquery at all.

all could be solved in the handlebar templates

from jquery-i18next.

let i18nextInstance = i18next.createInstance();

do you init that with options?

from jquery-i18next.

import i18next from 'i18next';
import XHR from 'i18next-xhr-backend';
//import Cache from 'i18next-localstorage-cache';
//import sprintf from 'i18next-sprintf-postprocessor';
import LanguageDetector from 'i18next-browser-languagedetector';

i18next
  .use(XHR)
  //.use(Cache)
  .use(LanguageDetector)
  //.use(sprintf)
  .init(options, () => { /* ready */ });

// in handlebars use a helper using i18next.t

from jquery-i18next.

In our system we are using standard html page, Handlebar templates and React JSX.

Handlerbar templates are translated properly . No issue

For standard html I am using data-18n attribute.
I have initialized i18next once with options as you mentioned.
Again for i18next jquery
let i18nextInstance = i18next.createInstance();
Then called i18nextJquery.init(i18nextInstance, $, i18nv2Options); //now missing key issue has gone

after that used $(".welcome").localize(); -- this is not translating the data-i18n key under that div class.

from jquery-i18next.

@jamuhl I am still facing issue to use data-i18n . Does it work without i18nextJquery plugin in V2 for plain html file translation?

from jquery-i18next.

This issue is now resolved.
After doing this (called i18nextJquery init from callback function):

i18next.use(i18XHR)
.use(i18LngDetector)
.init(i18nv2Options, () => { /* ready */
i18nextJquery.init(i18next, $);
$("body").localize();
});

from jquery-i18next.

good news

from jquery-i18next.

is there a executable demo? I just can not know how to use it

from jquery-i18next.

@jackple hope that helps: https://github.com/i18next/jquery-i18next/blob/master/example/sample.html

from jquery-i18next.

Hi @jamuhl.
Is there a working example with translation from json file like your comment above?
Is it always necessary to import the i18next library besides jquery-i18next?

Thanks.

from jquery-i18next.

Thanks a lot, it was very useful.

from jquery-i18next.

If you like this module don’t forget to star this repo. Make a tweet, share the word or have a look at our https://locize.com to support the devs of this project -> there are many ways to help this project 🙏

from jquery-i18next.