我在Flex中有一个DataGrid,一列是复选框,另一列是数值。单击复选框时,数值应更改,如果未选中该复选框,则更改为0;如果选中该复选框,则更改为预定义的最小值。这是我的代码:
<mx:DataGrid x="0" y="45" width="272" height="525" dataProvider="{dp}" variableRowHeight="true" editable="true" id="equipmentDG" verticalAlign="middle">
<mx:columns>
<mx:DataGridColumn headerText="" headerStyleName="gridheader" width="20" dataField="included" editorDataField="selected" rendererIsEditor="true">
<mx:itemRenderer>
<fx:Component>
<mx:CheckBox click="handleClicks(event)">
<fx:Script>
<![CDATA[
public function handleClicks(event:MouseEvent):void
{
data.included = !data.included;
if(data.included && data.antal == 0)
data.antal = data.minNo;
else if(!data.included)
data.antal = 0;
}
]]>
</fx:Script>
</mx:CheckBox>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="Antal" headerStyleName="gridheader" width="40" dataField="antal" editorDataField="value" editable="true">
<mx:itemEditor>
<fx:Component>
<mx:NumericStepper stepSize="1" width="35" height="20" focusOut="numericstepper1_changeHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.NumericStepperEvent;
override public function set data(value:Object):void
{
super.data = value;
if (value && value.hasOwnProperty("minNo"))
minimum = value.minNo;
if (value && value.hasOwnProperty("maxNo"))
maximum = value.maxNo;
}
protected function numericstepper1_changeHandler(event:Event):void
{
if(data.antal > 0)
data.included = true;
else
data.included = false;
}
]]>
</fx:Script>
</mx:NumericStepper>
</fx:Component>
</mx:itemEditor>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
数据中的值更新(当我关闭并打开其中的对话框时,我可以看到它),但它不会立即在数据网格中更新。单击复选框后,如何才能使值明显改变?
答案 0 :(得分:3)
在您的数据对象中,确保每次包含的属性更改时触发事件。在第二个itemRenderer中,只要属性发生变化,就会监听事件并更新值。
概念上是这样的:
在数据对象中:
private var _included : Boolean;
public function get included():Boolean{
return this._included;
}
public function set included(value:Boolean):void
this._included = value;
this.dispatchEvent(new Event('includedChanged');
}
将渲染器添加到第二列,如下所示:
<mx:DataGridColumn headerText="Antal" headerStyleName="gridheader" width="40" dataField="antal" editorDataField="value" editable="true">
<mx:itemRenderer>
<fx:Component>
<mx:Label dataChange="onDataChange()" >
<fx:Script>
<![CDATA[
public function onDataChange():void{
thistext = data['Antal'];
this.data.addEventListener('includedChanged',onIncludedChange);
}
public function onIncludedChange(e:Event):void{
this.text = data['Antal'];
}
]]>
</fx:Script>
</mx:Label>
</fx:Component>
</mx:itemRenderer>
<mx:itemEditor>
<fx:Component>
<mx:NumericStepper stepSize="1" width="35" height="20" focusOut="numericstepper1_changeHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.NumericStepperEvent;
override public function set data(value:Object):void{
super.data = value;
if (value && value.hasOwnProperty("minNo"))
minimum = value.minNo;
if (value && value.hasOwnProperty("maxNo"))
maximum = value.maxNo;
}
protected function numericstepper1_changeHandler(event:Event):void
{
if(data.antal > 0)
data.included = true;
else
data.included = false;
}
]]>
</fx:Script>
</mx:NumericStepper>
</fx:Component>
</mx:itemEditor>
</mx:DataGridColumn>
答案 1 :(得分:1)
我只想将antal标记为[Bindable]并使用dp作为ArrayCollection。
答案 2 :(得分:-1)
以下是快速而肮脏的方法:重新分配dataProvider
。这应该会强制DataGrid失效。