Passing Settings from Drupal Module to Javascript: Uncaught TypeError: Cannot read property

Question

In my module I have the following code.

$my_settings = array(
    'basePath' => '/',
    'my_locs' => $my_locs // Array of numbers
);

drupal_add_js(array('my_module' => $my_settings), 'setting');

In the JavaScript I am supposed to retrieve settings as follows.

var my_locs = Drupal.settings.my_module.my_locs;

From Goggle Chrome console, I get the following error.

Uncaught TypeError: Cannot read property 'my_locs' of undefined google_elev.js

These are the various output I obtain from the console.

>my_locs
undefined

>Drupal.settings.my_module.my_locs
[41, 9, 42, 9]

>my_locs = 2
2

>var my_locs
undefined

>my_locs = Drupal.settings.my_module.my_locs
[41, 9, 42, 9]

 >my_locs 
[41, 9, 42, 9]

All the rest in the JavaScript file works perfectly; variables are readed, computed, snd used. Settings are loaded in Drupal.settings before loading the JavaScrip file with drupal_add_js().

I don't know what to try. I don't understand if it is a syntax problem, if I must define the var to be an array before, or if something tricky in the order of callings have to be accomplished.

Answer 1

Try this

(function($) {
  Drupal.behaviors.myModule_someJS = {

    anotherFunction: function() {
      console.log(this.vars.initial_page);
    },

    attach: function(context, settings) {

      this.vars = {
        initial_page  : Drupal.settings.myModule.initial_page
      }

      this.anotherFunction();

    }
  }
})(jQuery);

Drupal.settings won’t contain the custom stuff sent through from my module until the attach function is called, so therefore every settings variable can only be called inside attach()

Answer 2

For future readers who will have the same problem.

My call for retrieving Drupal settings variables was made in the declaration part of the JavaScript:

var my_locs = Drupal.settings.my_module.my_locs;

I supposed this would be correct, since the Drupal settings object is already created, and since Javascript allows, like Java, the creation of new objects at declaration time. But for some reason it didn't work.

I solved leaving the declaration

var my_locs;

and passing the object inside an initialize() method.

function initialize() {
    my_locs = Drupal.settings.my_module.my_locs;
    [...]

I hope it can be useful, since I lost lot of time on this.