Ext JS Cascading Combobox - json

Question

I'm trying to create a cascading combobox but I'm failing to populate the second combobox.
At the moment I've something like this:
var comboStore = null;
comboStore = Ext.create('Ext.data.Store', {
fields: ['ID', 'Name', 'isChecked'],
data: field.values
});
console.log(comboStore);
var comboboxField = Ext.create('SGS.view.field.ComboBox', {
listeners: {
select: function (combo, record, index) {
var tablescomboStore = null;
Ext.Ajax.request({
url: 'Services/DBSourceService.ashx',
method: 'GET',
params: {
id: combo.value
},
reader: {
type: 'json',
rootProperty: 'data', successProperty: 'success'
//root: 'items'
},
success : function(response, opts)
{
var tablescomboStore = null;
tablesComboStore = Ext.create('Ext.data.Store', {
response: ['ID', 'Name', 'isChecked'],
data: response.values
});
var tablesComboboxField = Ext.create('SGS.view.field.ComboBox', {
cls: 'ACombo3',
labelSeparator: '',
labelWidth: 110,
width: 400,
fieldLabel: response.name,
name: response.propName,
displayField: 'Name',
valueField: 'ID',
forceSelection: true,
editable: false,
store: tablesComboStore
});
if (tablesComboStore != null) {
var selected = null;
Ext.each(tablesComboStore.data.items, function (item) {
if (item.data.Checked) { selected = item; }
});
if (selected) tablesComboboxField.select(selected);
}
tablesComboboxField.addListener('select', checkDirty);
instance.add(tablesComboboxField);
},
});
}
},
cls: 'ACombo2',
labelSeparator: '',
labelWidth: 110,
width: 400,
fieldLabel: field.name,
name: field.propName,
displayField: 'Name',
valueField: 'ID',
forceSelection: true,
editable: false,
store: comboStore
});
if (comboStore != null) {
var selected = null;
Ext.each(comboStore.data.items, function (item) {
if (item.data.Checked) { selected = item; }
});
if (selected) comboboxField.select(selected);
}
comboboxField.addListener('select', checkDirty);
instance.add(comboboxField);
I first receive a Json which I put in a store to create some form fields, like Name, Value and Combobox. I want to receive a second Json to populate my second combobox after the first combobox selection.
The second combobox is being created, but without no data.

Answer 1

you can't use response directly since it is a string. try to parse it first:
here you go:
var myArr = JSON.parse(response.responseText);
Ext.each(myArr.values, function (value) {
var tablescomboStore = null;
tablesComboStore = Ext.create('Ext.data.Store', {
fields: ['ID', 'Name', 'isChecked'],
data: myArr.values
});
var tablesComboboxField = Ext.create('SGS.view.field.ComboBox', {
cls: 'ACombo3',
labelSeparator: '',
labelWidth: 110,
width: 400,
fieldLabel: value.name,
name: value.propName,
displayField: 'Name',
valueField: 'ID',
forceSelection: true,
editable: false,
store: tablesComboStore
});