Flex/DataGrid: update each row dataProvider is changed
In a DataGrid, how can I force data() of all itemRenderers on visible rows to be called when I've made an update to the dataProvider.
I'n the following the Grid isn't updated after pressing doSomething. If I have a large list the update is done when scrolling down and then back up again, or in the case of the TreeGrid i open/close a node.
<?xml version="1.0" ?>
<mx:VBox
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:flexlib="http://code.google.com/p/flexlib/"
initialize="_initialize()">
<mx:Script>
<![CDATA[
import mx.events.CollectionEvent;
import mx.controls.Alert;
import Icons;
[Bindable]
private var dataProvider0:XML;
private function _initialize():void
{
dataProvider0 = <node>
<node label="A" option="1">
<node label="C" option="1"/>
<node label="D" option="1"/>
</node>
<node label="B" option="1">
<node label="E" option="1"/>
<node label="F" option="1"/>
</node>
</node>;
}
private function doSomething():void
{
dataProvider0.node[0].@option = 0;
dataProvider0.node[0].node[0].@option = 0;
}
]]>
</mx:Script>
<flexlib:TreeGrid
id="treeGrid1"
width="500"
height="300"
showRoot="false"
verticalTrunks="none"
paddingLeft="0"
disclosureClosedIcon="{Icons.folderClosed}"
disclosureOpenIcon="{Icons.folderOpen}"
dataProvider="{dataProvider0}">
<flexlib:columns>
<flexlib:TreeGridColumn dataField="@label" headerText="Section"/>
<mx:DataGridColumn dataField="@option" headerText="Option" width="50">
<mx:itemRenderer>
<mx:Component>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" verticalAlign="middle" horizontalAlign="center" width="100%" height="100%">
<mx:Script>
<![CDATA[
[Bindable]
override public function set data(value:Object):void
{
super.data = value;
chkMain.selected = value.@option == "1";
}
]]>
</mx:Script>
<mx:CheckBox id="chkMain"/>
</mx:Box>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</flexlib:columns>
</flexlib:TreeGrid>
<mx:DataGrid
id="dataGrid1"
width="500"
height="300"
dataProvider="{dataProvider0.node}">
<mx:columns>
<mx:DataGridColumn dataField="@label" headerText="Section"/>
<mx:DataGridColumn dataField="@option" headerText="Option" width="50">
<mx:itemRenderer>
开发者_StackOverflow社区 <mx:Component>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" verticalAlign="middle" horizontalAlign="center" width="100%" height="100%">
<mx:Script>
<![CDATA[
[Bindable]
override public function set data(value:Object):void
{
super.data = value;
chkMain.selected = value.@option == "1";
}
]]>
</mx:Script>
<mx:CheckBox id="chkMain"/>
</mx:Box>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
<mx:Button label="Do" click="doSomething()"/>
</mx:VBox>
Have you tried
private function doSomething():void
{
dataProvider0.node[0].@option = 0;
dataProvider0.node[0].node[0].@option = 0;
// force a redraw at earliest opportunity
treeGrid1.invalidateDisplayList();
}
Try this:
private function doSomething():void
{
dataProvider0.node[0].@option = 0;
dataProvider0.node[0].node[0].@option = 0;
treeGrid1.dataProvider.refresh();
dataGrid1.dataProvider.refresh();
}
精彩评论