Namespace Problem (I think)

Namespace Problem (I think)

Hi,

I've got a problem wich is based on namespaces conventions, I think.

Here is a function from inside the $(document).ready():

  1. var onGetGroups = function( response ) {
  2.         userGroups = response;
  3.         console.log( userGroups.data.length );
  4.         for( var i = 0; i < userGroups.data.length; i++ ) {
  5.             console.log( userGroups.data[i].name );
  6.             $( '#allGroups' ).append( '<li class="ui-selectable" id="' + userGroups.data[i].id + '">' + userGroups.data[i].name + '</li>' );
  7.             $( '#allGroups' ).selectable( { filter: "li", selected: function( event, ui ) {
  8.                 $( ".ui-selected", this ).each( function() {
  9.                     var index = $( '#allGroups li' ).attr( 'id' );
  10.                     var name = $( '#allGroups li' ).textContent;
  11.                     sg.push({id: index, name:name}); // PROBLEM!!
  12.                 } );
  13.             } } );
  14.         }
  15.         console.log( sg );
  16.     };
    You can see my problem on line 12. This sg object is defined directly after the ready state but I can't change it from this position in code. I always get an error: "Uncaught TypeError: Cannot read property 'push' of undefined", wich is, as I think, a problem of namespaces. 

    1. $( document ).ready( function() {
    2.     var accessToken, uid, userGroups, sg = {};

    I think the sg var is global and can get accessed from everywhere in the code. But it isn't. Where is my fault?

    - Thx, Michael