I have a component like the following and it completely crashes the design view in flex builder

Question

I have a component like the following and it completely crashes the design view in flex builder.I can see anything in the layout. Everything compliles fine and looks normal in the outline view. Any ideas whats wrong. If I remove the AdvancedDataGridColumnGroup's all looks fine
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel x="353" y="34" width="1159" height="505.7" maxWidth="663" allowDrag="true" allowResize="true" allowClose="true" allowMaximize="true" allowMinimize="true" resizeEffect="Resize" moveEffect="Move" close="parent.removeChild(this)" maxHeight="680" layout="absolute" title="Back office list" xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:AdvancedDataGrid id="deals" displayItemsExpanded="true" dataProvider="{tradesResult}" width="100%" height="373" sortExpertMode="true" variableRowHeight="true" headerStyleName="smallHeader" editable="false" fontWeight="normal">
        <mx:columns>
            <mx:AdvancedDataGridColumn width="75">
            </mx:AdvancedDataGridColumn>
            <mx:AdvancedDataGridColumnGroup headerText="Client side">
                <mx:AdvancedDataGridColumn dataField="Reference" headerText="Mon Ref" width="60" editable="true" wordWrap="true" showDataTips="true" textAlign="center"/>
                <mx:AdvancedDataGridColumn dataField="clientside" headerText="MC Pr" textAlign="center" wordWrap="true" width="70">
                </mx:AdvancedDataGridColumn>
            </mx:AdvancedDataGridColumnGroup>
            <mx:AdvancedDataGridColumnGroup headerText="Bank side">
                <mx:AdvancedDataGridColumn dataField="bankDealRef" headerText="Bank Ref" width="70" editable="true" wordWrap="true" dataTipFunction="dataTipFuncNotes" showDataTips="true" textAlign="center"/>
                <mx:AdvancedDataGridColumn dataField="Premium2" headerText="Bank Pr" width="55" editable="true" wordWrap="true" showDataTips="true" textAlign="center"/>
            </mx:AdvancedDataGridColumnGroup>
        </mx:columns>
    </mx:AdvancedDataGrid>
</mx:Panel>

Answer 1

Nikos,
When using grouped columns you should change the <mx:columns> to <mx:groupedColumns>, I ran this example in a sandbox app and it works fine.
EXAMPLE:
<mx:AdvancedDataGrid id="deals" displayItemsExpanded="true" dataProvider="{flatData}" width="100%" height="373"
        sortExpertMode="true" variableRowHeight="true" headerStyleName="smallHeader" editable="false" fontWeight="normal">
       <mx:groupedColumns>
            <mx:AdvancedDataGridColumn width="75">
            </mx:AdvancedDataGridColumn>
            <mx:AdvancedDataGridColumnGroup headerText="Client side">
                <mx:AdvancedDataGridColumn dataField="customer" headerText="Mon Ref" width="60" editable="true" wordWrap="true" showDataTips="true" textAlign="center"/>
                <mx:AdvancedDataGridColumn dataField="product" headerText="MC Pr" textAlign="center" wordWrap="true" width="70">
                </mx:AdvancedDataGridColumn>
            </mx:AdvancedDataGridColumnGroup>
            <mx:AdvancedDataGridColumnGroup headerText="Bank side">
                <mx:AdvancedDataGridColumn dataField="revenue" headerText="Bank Ref" width="70" editable="true" wordWrap="true"
                    showDataTips="true" textAlign="center"/>
                <mx:AdvancedDataGridColumn dataField="cost" headerText="Bank Pr" width="55" editable="true" wordWrap="true" showDataTips="true" textAlign="center"/>
            </mx:AdvancedDataGridColumnGroup>
        </mx:groupedColumns>
    </mx:AdvancedDataGrid>
HTH,
Kenny Yates