Can not read property of undefined i18n - javascript

When I try to pass language dynamically from select dropdown list, It shows following error
Uncaught TypeError: Cannot read property 'properties' of undefined at changeLanguage
Where changeLanguage is my function as follows:
function changeLanguage(lang)
{
lang = lang || "en_EN"; // if no language is set, use browser default
jQuery.i18n.properties({
path : 'language',
mode : 'both', language: lang,
name: 'Messages',
callback: refresh_i18n });
}
Following are the pictures of it:
Dropdown image
Console error
What is wrong with the code?
Please do suggest!
Thanks
UPDATE:
FOR MORE EXPLANATION:
This is my index file and initially I call it with onload it works fine.
<script>
function refresh_i18n() {
console.log('Some code...')
}
function changeLanguage(lang) {
lang = lang || "en_EN";
jQuery.i18n.properties({
path : 'js/libs/language',
mode : 'both',
language: lang,
callback: refresh_i18n
});
}
changeLanguage("en_US");
</script>
but when i call by changing dropdown like:
$('#selectLanguage').change(function(){
changeLanguage(this.value);
});
It gives above error

Probrably the i18n library is loading before the jquery (problems haha).
So, put the jQuery loading in the head of the html and the plugin i18n (and others, if you are using) in the body (I suggest in the end of body) of the html.
That must solve the problem.

Related

VueJS parameters do not work correctly in the page

I wrote my vue in an external file and added it to the bottom of the page but it does not work completely. For example, when using v-model, the page contains an error:
Error compiling template
When the page loads, I give my data from the API and put it in a parameter but my template shows the parameter as empty. In my dev tools, it shows me that the API responded with all my data.
Here is my get_Data method :
get_type_data() {
get_data().subscribe(function (x: any) {
this.types = x.data;
console.log(this.types);
});
},
In the console it shows the right values but when I use it in the template it is empty. What should i do?
Use a fat arrow notation ..
get_type_data() {
get_data().subscribe(x => {
this.types = x.data;
console.log(this.types);
});
},

'Events' Attribute missing on the ZiggeoApi object when using v2

I've got a problem with v2 of ziggeo.
Following is my case:
I'm using ziggeo from that url:
//assets-cdn.ziggeo.com/v2-stable/ziggeo.js
I initialise it with the following code:
new ZiggeoApi.V2.Application({
token: {TOKEN},
language: {LANGUAGE},
webrtc_streaming: true
});
And if I output 'ZiggeoApi' the following appears:
So the main problem is now that 'Events' doesnt exist in the object. And if I use the following code which I got from your site (Here: https://ziggeo.com/docs/sdks/javascript/browser-integration/embed-methods#javascript-version=v2) with that at the beginning:
ZiggeoApi.Events.on("system_ready", function() {
... it doesn't work and produces an error. Because of the missing 'Events' Attribute I'm also not able to use any other functionality which is connected with events.
When I change the version to v1-stable in the url it's working.
Is this a bug or what am I doing wrong?
I've found a solution. You have to do it this way:
Initialise the app:
let app = new ZiggeoApi.V2.Application({
token: {TOKEN},
language: {LANGUAGE},
webrtc_streaming: true
});
Then call the 'on ready' function directly on the initialised object:
app.on('ready', function() {
// do what you want!
});
That's the way how you have to do it with Ziggeo V2.

How to set language file dynamicly in TinyMCE v4

I try to set my script in a way that it's get the language from the <html> attribute. As a basic concept that works fine, the only problem is that I have a customized location where the localization files are located.
How do I have to set the parameter language_url for en_US. I tried a empty string '' as well as the value false with no success. I'm getting the error:
Failed to load plugin url: https://localhost/js/tinymce/langs/en_US.js
That is because there is no language file for en_US.
var lang = $('html').attr('lang');
tinymce.init({
selector: 'textarea',
language_url: (lang === 'en' ? '' : '/js/tinymce/langs/de.js'),
language: (lang === 'en' ? 'en_US' : 'de')
});
Is there no default value for language_url?
Two comments on this...
If you are placing the language files in the langs folder within TinyMCE you don't need to use the language_url configuration option at all. That is only needed if you want to store the files in a different location. Your example above seems to imply that you are placing the language files in the langs folder in your TinyMCE distribution and if that is the case you just don't need that setting at all.
If you really need that setting (but only sometimes) you can use JavaScript to make that happen...
You start by creating a "default" init object as a JavaScript variable on your page and then reference that later. For example:
var default_init = {
theme: "modern",
plugins....,
toolbar....
}
...then when you want to invoke a TinyMCE instance you can use that base object to make your init:
var lang = $('html').attr('lang');
if (lang !== 'en') {
default_init.language_url = '/js/tinymce/langs/' + lang + '.js';
}
tinymce.init(default_init);

How do I resolve an AutoComplete error when using CodeMirror?

I want to use the AutoComplete of CodeMirror, but I'm getting the error:
Uncaught TypeError: Cannot read property 'javascript' of undefined
CodeMirror.commands.autocomplete = function(cm) {
CodeMirror.showHint(cm, CodeMirror.hint.javascript); // Error Here
}
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
lineNumbers: true,
extraKeys: {"Ctrl-Space": "autocomplete"}
});
In order to use autocomplete capabilities, you must insure to include the appropriate scripts, i.e. show-hint.js, show-hint.css and javascript-hint.js (which seems like the one causing the fuss here).
Take a look at the autocomplete demo's source code for a reference.

Why do I recieve both "$jQval is undefined" and "$.validator.unobtrusive is undefined" when using RequireJS?

This has had me puzzled for a few hours now. When the script is in a non-requirejs javascript file it works fine. When I use it with RequireJS it fails to work and gives me the error messages in the question title (though the firebug console).
I was just trying to get it to "work" with RequireJS before attempting to refactor into a module.
The Html is rendering correctly. The scripts are loading correctly. Also, I'm using the require-jquery.js bundle download, which is referenced in the layout template across all pages.
main.js:
require.config({
paths: {
"maximum-filesize": "modules/validation/maximum-filesize"
}
});
require(["maximum-filesize", "domReady!"], function (maxFileSize) {
});
maximum-filesize.js
require.config({
paths: {
"jquery-validate": "libs/jquery/jquery.validate",
"jquery-validate-unobtrusive": "libs/jquery/jquery.validate.unobtrusive"
}
});
define(["jquery", "jquery-validate", "jquery-validate-unobtrusive", "domReady!"], function ($) {
$.validator.unobtrusive.adapters.add(
'filesize', ['maxsize'], function(options) {
options.rules['filesize'] = options.params;
if (options.messages) {
options.messages['filesize'] = options.message;
}
});
$.validator.addMethod('filesize', function (value, element, params) {
if (element.files.length < 1) {
// No files selected
return true;
}
if (!element.files || !element.files[0].size) {
// This browser doesn't support the HTML5 API
return true;
}
return element.files[0].size < params.maxsize;
}, '');
});
Edit 1
I just tried commenting out all of the above code, and replaced it with a simple:
$('#Name').val("Hello");
This rendered "Hello" correctly in the #Name textbox, so JQuery is working.
You should use requires shim option to tell requires to load jquery before jquery validate. Otherwise load order is undefined.
Another possible problem is calling requirejs.config 2 times. Requirejs has problems with merging configs

Categories