I am using flex when i was select combobox item i want to create new form
for eg. when i select 1 it will appear one form when i select 2 it will appear
two.so and so....
Put your Forms inside of a ViewStack container. You can then bind the ViewStack's selectedIndex to the selectedIndex of your ComboBox:
<mx:ComboBox id="comboBox" />
<mx:ViewStack selectedIndex="{comboBox.selectedIndex}">
<mx:Form id="formA">
...
</mx:Form>
<mx:Form id="formB">
...
</mx:Form>
</mx:ViewStack>
Related
Hi I am trying to pass the rowindex when I click on a button in a row, the data value returns the correct information but the rowIndex returns nothing.
<mx:AdvancedDataGridColumn headerText="EDIT" showDataTips="false" editable="true">
<mx:itemRenderer>
<fx:Component>
<mx:HBox horizontalAlign="center" verticalAlign="middle">
<s:Button label="Edit" id="editGeo" click="{outerDocument.onClick(data, rowIndex)}"/>
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
thanks !
I'm surprised you're provided code does not throw an error.
You need to access listData.rowIndex. listData should be an instance of the AdvancedDataGridListData class.
<s:Button label="Edit" id="editGeo" click="{outerDocument.onClick(data, listData.rowIndex)}"/>
Since the HBox does not have a listData property, you may have to implement it on your own for the data to be passed in. Something like this should suffice:
[Bindable]
public var listData:BaseListData;
It has been a while since I've been deep into an MX component, so my memory is a bit rusty on the last part.
In addition to the first answer, try not to use listData.rowIndex when your datagrid has the vertical scroll bar, because the rowIndex just shows the index of current visible Rows.
Try to use the current object index in the DataProvider of the datagrid instead.
I have a datagrid with a single column rendered with another datagrid. I'm doing this to implement a rowspan-like display (with a hbox beneath the child datagrid) showing messages under each row.
When I tab and reach the end of a row, I want the focus to pass to the next row i.e the next child datagrid and on a specific cell of that row.
This is the simplified code calling the renderer :
<mx:DataGrid width="100%"
showHeaders="false"
selectable="false"
id="ParentDatagrid"
dataProvider="{arrayActs}"
paddingBottom="0" paddingTop="0"
variableRowHeight="true">
<mx:columns>
<mx:DataGridColumn itemRenderer="components.ColumnRendererDatagrid"/>
</mx:columns>
</mx:DataGrid>
And the renderer (ColumnRendererDatagrid) code :
<mx:DataGrid
id="dgLocal" width="100%" height="23" borderSides=""
dataProvider="{data}" showHeaders="false"
editable="true" selectable="false">
<mx:columns>
<mx:DataGridColumn />
<mx:DataGridColumn />
<mx:DataGridColumn />
<mx:DataGridColumn />
<mx:DataGridColumn />
</mx:columns>
</mx:DataGrid>
<mx:HRule width="100%" />
<mx:Label id="message" text="Error Message" width="100%" />
For the moment, I'm using the following snippet in ColumnRendererDatagrid to check when tabbing reaches the end of the row and bubble up the event :
if(dgLocal.editedItemPosition.columnIndex == 13){
dispatchEvent(new Event(MOVE_FOCUS_DOWN, true));
From there I'm struggling on how to drill down into the renderer to set the focus once the higher component get this event. Any help would be really appreciated. Thx
Ok, here is the solution I came up with. This is the code in the parent's event handler (handling the MOVE_FOCUS_DOWN):
//Find the postition of the item that sent the event :
for each( var row:Object in ParentDatagrid.dataProvider ) {
if( (event.target as ColumnRendererDatagrid).data == row) {
break;
}
i++;
}
//Get the renderer of the next item :
var render:IListItemRenderer = ParentDatagrid.itemToItemRenderer(arrayActes.getItemAt(i+1));
(render as ColumnRendererDatagrid).dgLocal.editedItemPosition = {rowIndex:0, columnIndex:1}
(obviously checks should be made in real code to see if the next object exists) which is of type ColumnRendererDatagrid. From there I just set the focus/editing position.
I have a comboBox and values like basic and advanced. And viewstack container conatains 2 grids.
When i select the base option in Combobox, the first grid has to be selected. select the advanced value in comboBox, the second grid has to be selected.
Please chck my below code and help me how to do it.
<mx:ViewStack id="viewstack1" width="95%" height="85%" x="0" y="63" >
<tables:KeyMetricsBasicTable basicArrayDataProvider="{basicArrayResult1}" width="100%" height="100%"/>
<tables:KeyMetricsAdvTable advArrayDataProvider="{advArrayResult1}" width="100%" height="100%"/>
</mx:ViewStack>
Thanks,
Ravi
Something like this:
<mx:ComboBox id="comboBox" change="{viewstack1.selectedIndex = comboBox.selectedIndex}" />
how do i change the item selected in a combobox selection based on a selection of a datagrid object?
Just bind the selectedItem property of the combobox to the dataGrid:
<s:ComboBox
id="combo"
dataProvider="{data}"
selectedItem="{dg.selectedItem}" />
<mx:DataGrid
id="dg"
dataProvider="{data}"/>
use the itemClick event on the datagrid to change the selection of the combo box.
You can find similar answer here Itemclick event in datagrid
Within a DataGrid, I have a DataGridColumn that uses a custom component as the item renderer. Within the component, I have an ArrayCollection that stores a set of value objects. My problem is that I cannot access the ArrayCollection values from outside of the item renderer component. Does anyone know how it would be possible to do this? I have posted a code snippet below.
<mx:Script>
<![CDATA[
// Cannot access arrFiles from here.
]]>
</mx:Script>
<mx:DataGrid editable="true">
<mx:columns>
<mx:DataGridColumn id="dgcUpload" width="130" headerText="Uploaded Files"
editable="false">
<mx:itemRenderer>
<mx:Component>
<mx:VBox>
<mx:Script>
<![CDATA[
[Bindable]public var arrFiles:ArrayCollection = new ArrayCollection();
]]>
</mx:Script>
</mx:VBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
Is this possible?
Thank you in advance for any assistance,
Orville
I would create a custom MXML Box component as the rendered with a label (myLabel) as a child. Set the data provider for the DataGrid to the array. In the custom MXML component override the set data method which is called each time the data is rendered for each row and set the label to the current value passed in:
override public function set data(value:Object):void{
myLabel.text = value.myTextForLabel;
}
If the field in the ArrayCollection (myArrayCollection) is always the same for the label, then just set the DataGrid data provider to the ArrayCollection and the dataField property of the column to the appropriate value (myText):
<mx:DataGrid editable="true" dataProvider="myArrayCollection">
<mx:columns>
<mx:DataGridColumn id="dgcUpload" width="130" dataField="myText" headerText="Uploaded Files"
editable="false">
</mx:columns>
</mx:DataGrid>
It is possible depending on how you want to access it. You can access the property of a specific item being rendered by the itemRenderer by calling the itemToItemRenderer function on the datagrid. That gives you an instance of that specific itemRenderer and you can call the arrFiles variable for that item.
Here's an example
protected function datagrid1_clickHandler(event:MouseEvent):void
{
var obj:Object = dgcUpload.itemToItemRenderer(dgcUpload.selectedItem);
var newArray:ArrayCollection = obj.arrFiles;
}
I call that when something is clicked on the DataGrid and I want to access the arrFiles variable for the selected item.
Is that what you're looking for?
=Ryan