Generate a Ajax Radio List - extjs

Question

I need to create a list of clickable radio buttons that gets generated through an ajax request. They will look like this:
10/15/2018
10/14/2018
10/13/2018
....
So I am doing the Ajax call below and getting the result:
onTabChange: function (tabPanel, tab) {
if (tab.getTitle() == 'Reconciliation') {
Ext.Ajax.request({
url: '***',
reader: {
type: 'json',
rootProperty: 'data'
},
useDefaultXhrHeader: false,
withCredentials: true,
scope: this,
success: function (response) {
var selectReconciliation = this.lookupReference('lisatradereconciliation');
// Get the data from Ajax Request and shape it
var data = Ext.JSON.decode(response.responseText).data;
var reconciliationItems = [];
// Put the data into a shape that it will need to look like on the page
for (var i in data) {
reconciliationItems.push("boxLabel: '" + data[i].substr(5, 2) + "/" + data[i].substr(8, 2) + "/" + data[i].substr(0, 4) +"', name: 'rI', inputValue: 'data[i]'");
}
},
failure: function (response) {
'***'
}
});
}
},
Which then I am sending it to the view radiogroup item as follows:
items: [{
xtype: 'radiogroup',
fieldLabel: 'day',
items: reconciliationItems
}]
But this doesn't work.

Answer 1

The reconciliationItems array should be defined as a global variable, or outside of your ajax success handler, to achieve what you want:
Define the array outside of success:
window.reconciliationItems = [];
And then access it in the success handler like so:
success: function (response) {
var selectReconciliation = this.lookupReference('lisatradereconciliation');
// Get the data from Ajax Request and shape it
var data = Ext.JSON.decode(response.responseText).data;
// var reconciliationItems = []; <-- Dont define here
// Put the data into a shape that it will need to look like on the page
for (var i in data) {
reconciliationItems.push("boxLabel: '" + data[i].substr(5, 2) + "/" + data[i].substr(8, 2) + "/" + data[i].substr(0, 4) +"', name: 'rI', inputValue: 'data[i]'");
}
},