ExtJS4: paggingtoolbar refresh button is not working propertly

The refresh button wasn't refreshing when I was clicking it. After hours of searching on the web I finally got the problem. The initial code was a definition of a gridpanel:


Ext.define('WebMonitorClass.view.BodegaGridPanel', {    
    extend: 'Ext.grid.Panel'
    ,alias: 'widget.bodegaGridPanel'

...
...
...
,store: Ext.create('WebMonitorClass.store.BodegasCrudGridPanelStore')
,bbar: {
            xtype: 'pagingtoolbar'
            ,dock: 'bottom'
            ,store : Ext.create('WebMonitorClass.store.BodegasCrudGridPanelStore')                                   
        }
...
...
...

}

The way to make it work is instantiating the store an setting it to the grid store and to the paging toolbar. All this occurs in the initComponent method  :

Ext.define('WebMonitorClass.view.BodegaGridPanel', {    
    extend: 'Ext.grid.Panel'
    ,alias: 'widget.bodegaGridPanel'
...
...
...
,initComponent: function() {
        
           this.store = Ext.create('WebMonitorClass.store.BodegasCrudGridPanelStore'); // initialize store
        
        this.bbar = Ext.create('Ext.toolbar.Paging', {
            // se obtiene error Uncaught TypeError: Cannot read property 'id' of undefined             
            //xtype: 'pagingtoolbar'
            dock: 'bottom'
            ,store : this.store // setting the previously initialized store to the pagging toolbar
            ,displayInfo: true
            ,displayMsg: 'Displaying topics {0} - {1} of {2}'
            ,emptyMsg: "No topics to display"
            ,listeners: {                
                afterrender: function (component){
                    //component.down('#refresh').hide()
                }
            }                              
            });
        
        this.callParent();
        
    }
...
...
...

}

Resource:
http://try.sencha.com/extjs/4.1.1/community/extjs4-mvc-paging-grid/

ExtJS 4.1: “Uncaught TypeError: Cannot call method 'substring' of undefined”

I was getting the error :

“Uncaught TypeError: Cannot call method 'substring' of undefined”

When I was trying to initialize an object from this class definition:


Ext.define('WebMonitorClass.view.CrearBodegaFormPanel', {    
    extend: 'Ext.form.FormPanel'
    ,alias: 'widget.crearBodegaFormPanel'       
    ,layout:'absolute'
    ,border:false
    ,padding : '0 0 5 0'
    ,bodyStyle:'background-color: #DFE9F6;'
    ,width:360
    ,height:110
    ,initComponent: function() {                                                    
        this.callParent();                                    
    }
    ,items:[
        {xtype: 'bodegaDatosBasicosFieldSet'}
    ]
    ,buttonAlign:"center"
    ,buttons:[]
});

the solution was adding the require config parameter importing the file which that contains the definition of the bodegaDatosBasicosFieldSet class:

,requires: [ 'WebMonitorClass.view.BodegaDatosBasicosFieldSet' ]

So, the resulting class definition was


Ext.define('WebMonitorClass.view.CrearBodegaFormPanel', {    
    extend: 'Ext.form.FormPanel'
    ,requires: [ 'WebMonitorClass.view.BodegaDatosBasicosFieldSet' ] // here is what I added
    ,alias: 'widget.crearBodegaFormPanel'       
    ,layout:'absolute'
    ,border:false
    ,padding : '0 0 5 0'
    ,bodyStyle:'background-color: #DFE9F6;'
    ,width:360
    ,height:110
    ,initComponent: function() {                                                    
        this.callParent();                                    
    }
    ,items:[
        {xtype: 'bodegaDatosBasicosFieldSet'}
    ]
    ,buttonAlign:"center"
    ,buttons:[]
});

Django: _mysql_exceptions.OperationalError: (2003, "Can't connect to MySQL server on 'localhost' (10061)")

Trying to init my Django project I was getting this error:


_mysql_exceptions.OperationalError: (2003, "Can't connect to MySQL server on 'localhost' (10061)")

I was using this configuration


DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql', # Add 'postgresql_psycopg2', 'mysql', 'sqlite3' or 'oracle'.
        'NAME': 'backendtest',                      # Or path to database file if using sqlite3.
        'USER': 'remoteuser',                      # Not used with sqlite3.
        'PASSWORD': '123456789',                  # Not used with sqlite3.
        'HOST': 'localhost',                      # Set to empty string for localhost. Not used with sqlite3.
        'PORT': '3306',                      # Set to empty string for default. Not used with sqlite3.
    }
}

the solution is pretty simple, change the host value from 'localhost' to 127.0.0.1:

DATABASES = {

    'default': {

        'ENGINE': 'django.db.backends.mysql', # Add 'postgresql_psycopg2', 'mysql', 'sqlite3' or 'oracle'.

        'NAME': 'backendtest',                      # Or path to database file if using sqlite3.

        'USER': 'remoteuser',                      # Not used with sqlite3.

        'PASSWORD': '123456789',                  # Not used with sqlite3.

        'HOST': '127.0.0.1',                      # Set to empty string for localhost. Not used with sqlite3.

        'PORT': '3306',                      # Set to empty string for default. Not used with sqlite3.

    }

}

Now all works fine

Reference:

http://stackoverflow.com/questions/11121819/mysqldb-in-python-cant-connect-to-mysql-server-on-localhost

MySQL: grant remote access

GRANT ALL PRIVILEGES ON backendtest.* TO remoteuser@'%' IDENTIFIED BY '123456789';

Resource:
http://31bit.com/technology/86-mysql-database/302-how-to-grant-remote-access-to-a-mysql-database

MySQL: Adding foreing keys

ALTER TABLE phone ADD 
      CONSTRAINT FK_phone_person_num
      FOREIGN    KEY (person_num)
      REFERENCES person(num)

Resource:
http://www.sqlinfo.net/mysql/mysql_Create_foreign_key_contraints.php

ExtJS 4 : How to submit form or set listener to button without using Ext.getCmp and setting id

Use the up() method to get the ancestor element (ie form):

{
    xtype:'button' 
    ,text:'Crear Bodega'
    ,listeners: {                                      
         'click' : function(){               
              // get the form type ancestor which contains the button                                      
              var myFormPanelObj = this.up('form');
              var data  =   myFormPanelObj.getForm().getValues();
              console.log("data: " + Ext.JSON.encode(data));
                                             
           }
      }
}

Resource:
http://docs.sencha.com/ext-js/4-1/#!/api/Ext.button.Button-method-up