title: ExtJS 3.4 cascading combo box with AJAX
body: <p>I am trying to create two combo boxes, one enabling users to select a state and the other a local government area (LGA), and have it so the LGAs are filtered on the basis of the state selected. I'm using Ext 3.4 and populating data stores using an AJAX request. The filtering is being done with a REST query to Django.</p>
  
  <p>I believe the issue I'm having is coming down to variable scope, as the first combo box works fine but once I select a state I get an error stating "Uncaught TypeError: Cannot call method 'request' of undefined" when I'm trying to load the URL for the LGA combo box's data store. I've indicated where this is happening with a comment in the code (see below). I'm struggling to understand how I need to rejig the code to make things work. I'm a bit of a newbie to programming so apologies if the solution is a simple one. My code is below.</p>
  
  <p>Thanks in advance for any help.</p>
  
  <pre><code>Ext.onReady(function() {
  
    var stateStore = new Ext.data.JsonStore({
      autoDestroy: true,
      url: 'states.json',
      storeId: 'ste-store',
      root: 'records',
      id: 'ste-store',
      fields: ['state']
    });
  
    var lgaStore = new Ext.data.JsonStore({
      autoDestroy: true,
      url: '',
      storeId: 'lga-store',
      root: 'records',
      id: 'lga-store',
      fields: ['lga']
    });
  
    var stateCombo = new Ext.form.ComboBox({
      renderTo: document.body,
      id: 'ste-cb',
      typeAhead: true,
      triggerAction: 'all',
      lazyRender: true,
      mode: 'local',
      store: stateStore,
      displayField: 'state',
      valueField: 'state',
      listeners: {
        render: function(e) {this.getStore().load()},
        select: function(combo, record, index) {
      var selectedState = record.get('state');
      var lgaUrl = 'lgas.json?state=' + selectedState;
      lgaStore.url = lgaUrl; //Error is traced back to here
      lgaCombo.getStore().load(); 
        }
      }
    });
  
    var lgaCombo = new Ext.form.ComboBox({
      renderTo: document.body,
      id: 'lga-cb',
      typeAhead: true,
      triggerAction: 'all',
      lazyRender: true,
      mode: 'local',
      store: lgaStore,
      displayField: 'lga',
      valueField: 'lga',
    });
  
  });
  </code></pre>