How to declare global variables in Sencha Touch 2

Every Application requires to set Global Variables in order to access anywhere in your application.

For Example, Let's say if you want to set the BaseUrl and if you want to modify it, you need to modify it in one place instead of modifying more places of your application.

In Sencha Touch 2, declaring Global Variables is easy and it need to be  written inside Ext.Application. Below is the way to do it.

Ext.application({

    name: 'MyApp',
    baseUrl: 'http://domainname/path/index.php',
    launch:function(){}
});

We have set baseUrl as the Global variable of the application. If you need to access anywhere else (let's say in Store or Model), You need to use the below code,

MyApp.app.baseUrl;

This one follows the following format {<application name>.<app folder name>.<global variable>}

if you want to test whether this works, try adding the above access code inside Ext.Msg.alert() or console.log();

Another Way of declaring Global Variable

Sencha Touch 2 also provides another way of declaring Global variables inside launch() function. Let's rewrite the above code.

Ext.application({
    name: 'MyApp',
    launch:function(){
       var baseUrl = 'http://domainname/path/index.php';
    }
});

You can access the global variable (baseUrl) like this

Ext.Msg.alert(baseUrl);

This approach has one drawback i.e you need to make sure the same baseUrl variable is not set any where else in your application.

I hope, you enjoyed this Post.