My company still uses adobe Flex in a legacy system. My task is to dynamically render a DataGrid based on a list returned from API call. Simply speaking, the number of DataGridColumn, the corresponding headerText and the corresponding data have to be rendered dynamically.
e.g. 1: for condition A, resultList contains 1 Java DTO with 1 attribute, "exampleHeader1" has to be set as headerText and 1 DataGridColumn has to be rendered since there is only 1 attribute
<mx:DataGrid id="dtlGrid" dataProvider="{resultList}">
<mx:columns>
<mx:DataGridColumn/>
</mx:columns>
</mx:DataGrid>
e.g. 2: for condition B, resultList contains 1 Java DTO with 5 attributes, "exampleHeaderA", "exampleHeaderB", "exampleHeaderC", "exampleHeaderD" and "exampleHeaderE" have to be set as headerText respectively and 5 DataGridColumn have to be rendered since there are 5 attributes
<mx:DataGrid id="dtlGrid" dataProvider="{resultList}">
<mx:columns>
<mx:DataGridColumn/>
<mx:DataGridColumn/>
<mx:DataGridColumn/>
<mx:DataGridColumn/>
<mx:DataGridColumn/>
</mx:columns>
</mx:DataGrid>
Related codes are shown below but they don't work. More than 20 different conditions have to be implemented.
private function selectRecord():void {
var event:FindDetailEvent = new FindDetailEvent(lvGrid.selectedItem.id);
event.callback = setDetailRecord;
event.dispatch();
}
private function setDetailRecord():void {
if(resultList != null && resultList.length > 0) {
var condition:String = gm.pcyLvDtlList[0].condition;
var columns:Array = [];
switch(condition) {
case "condition1":
var column:DataGridColumn = new DataGridColumn();
column.headerText = "exampleHeader1";
column.dataField = resultList[0].itemValue;
columns.push(column);
case "condition2":
......
}
dtlGrid.columns = columns;
}
}
I can't find any useful information on the Internet regarding my use case since adobe Flex is a very old technology. Could someone please help?