JS global variable passing as undefined - jquery mobile

Question

I am trying to connect 2 js files but I can't seem to pass variables to it.

language.js file:

//SELECT LANGUAGE
var login_user, login_pass, login_page_loading_msg, login_button, login_register;
var dash_log_out, dash_loading_msg, dash_open_lifetime, dash_remind, dash_nothanks, dash_logout, dash_revenue, dash_value, dash_campaign, dash_status, dash_layer, dash_popdown, dash_leadorsale;
var stat_date, stat_view, stat_clicks;
var prog_choose, prog_info, prog_payperorder, prog_ordervolume, prog_countries, prog_conditions, prog_share, prog_url, prog_copytoclipboard, prog_copiedtoclipboard, prog_success, prog_ok;
var reg_title, reg_earn, reg_startearning, reg_participfree, reg_generalinfo, reg_language, reg_prefuser, reg_email, reg_details, reg_usertitle, reg_fn, reg_ln, reg_street, reg_postcode, reg_country, reg_tandc, reg_submit;
var menu_dash, menu_stat, menu_prog, menu_news;

$.getJSON("data/res/en.json", function(json) {

//ATTRIBUTE LANGUAGE
    //LOGIN PAGE VARIABLES

    login_user = json['login']['user'];
    login_pass = json['login']['pass'];
    login_page_loading_msg = json['login']['page_loading_msg'];
    login_register = json['login']['register'];
    login_button = json['login']['login'];

    //DASHBOARD PAGE VARIABLES  

    dash_log_out = json['dashboard']['log_out'];
    dash_loading_msg = json['dashboard']['loading_msg'];
    dash_open_lifetime = json['dashboard']['open_lifetime'];
    dash_remind = json['dashboard']['remind'];
    dash_nothanks = json['dashboard']['nothanks'];
    dash_logout = json['dashboard']['logout'];
    dash_revenue = json['dashboard']['revenue'];
    dash_value = json['dashboard']['value'];
    dash_campaign = json['dashboard']['campaign'];
    dash_status = json['dashboard']['status'];
    dash_adklicks = json['dashboard']['adklicks'];
    dash_layer = json['dashboard']['layer'];
    dash_popdown = json['dashboard']['popdown'];
    dash_leadorsale = json['dashboard']['leadorsale'];

    $('#logOut').html(dash_log_out);
    $('.loading').html(dash_loading_msg);


    //STATISTICS PAGE VARIABLES

    stat_date = json['statistics']['date'];
    stat_view = json['statistics']['views'];
    stat_clicks = json['statistics']['clicks'];

    //PROGRAMS PAGE VARIABLES

    prog_choose = json['program']['choose'];
    prog_info = json['program']['info'];
    prog_payperorder = json['program']['payperorder'];
    prog_ordervolume = json['program']['ordervolume'];
    prog_countries = json['program']['countries'];
    prog_conditions = json['program']['conditions'];
    prog_share = json['program']['share'];
    prog_url = json['program']['url'];
    prog_copytoclipboard = json['program']['copytoclipboard'];
    prog_copiedtoclipboard = json['program']['copiedtoclipboard'];
    prog_success = json['program']['success'];
    prog_ok = json['program']['ok'];

    //REGISTRATION PAGE VARIABLES


    reg_title = json['registration']['title'];
    reg_earn = json['registration']['earn'];
    reg_startearning = json['registration']['startearning'];
    reg_participfree = json['registration']['participfree'];
    reg_generalinfo = json['registration']['generalinfo'];
    reg_language = json['registration']['language'];
    reg_prefuser = json['registration']['prefuser'];
    reg_email = json['registration']['email'];
    reg_details = json['registration']['details'];
    reg_usertitle = json['registration']['usertitle'];
    reg_fn = json['registration']['fn'];
    reg_ln = json['registration']['ln'];
    reg_street = json['registration']['street'];
    reg_postcode = json['registration']['postcode'];
    reg_country = json['registration']['country'];
    reg_tandc = json['registration']['tandc'];
    reg_submit = json['registration']['submit'];

    //MENU VARIABLES


    menu_dash = json['menu']['dash'];
    menu_stat = json['menu']['stat'];
    menu_prog = json['menu']['prog'];
    menu_news = json['menu']['news'];
});

main.js file:

 [...]

console.log('login_button:'+ login_button);

 [...]

This gives me: login_button:undefined

How can I pass the variable value from within the function in the first file? If I assign it outside the function that gets json values then it passes correctly, but anything inside the function passes as undefined.

**

HOW I SOLVED IT:

**

language.js:

jQuery.extend({
    getValues: function(url) {
        var result = null;
        $.ajax({
            url: url,
            type: 'get',
            dataType: 'json',
            async: false,
            success: function(data) {
                result = data;
            }
        });
       return result;
    }
});
var results = $.getValues(yourUrlString);

How you load these files? There might be a problem in context where you load language.js to. Also there might be a problem with the order you load them — Jevgeni
– Jevgeni, Commented Sep 30, 2014 at 9:27
Simply load language.js before main.js and make sure You load them both. — patrykf
– patrykf, Commented Sep 30, 2014 at 9:27
Mind you that getJSON should be async, that means when you do the console log, the JSON might not be loaded, and those variables are not set yet. — user1600124
– user1600124, Commented Sep 30, 2014 at 9:31

user1600124 · Accepted Answer · 2014-09-30 09:44:50Z

1

You could defined a init function in your main.js, load your main.js before language.js. And in language.js, you call the init function after you've done setting the variables. I would also suggest that you namespace your global variables. Put them all in one giant object with an unique name perhaps. This avoids putting too much global variables into your global object and make it hard to track.

answered Sep 30, 2014 at 9:44

user1600124

4402 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Deea B · Accepted Answer · 2014-09-30 11:25:58Z

0

The above solutions would only function inside the init function, so if you need to use the variables in other functions as well in your main.js then this is the way to go:

jQuery.extend({
    getValues: function(url) {
        var result = null;
        $.ajax({
            url: url,
            type: 'get',
            dataType: 'json',
            async: false,
            success: function(data) {
                result = data;
            }
        });
       return result;
    }
});
var results = $.getValues(yourUrlString);

answered Sep 30, 2014 at 11:25

Deea B

3016 silver badges15 bronze badges

Collectives™ on Stack Overflow

JS global variable passing as undefined - jquery mobile

HOW I SOLVED IT:

**

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

HOW I SOLVED IT:

**

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related