如何检查/勾选项目渲染器中的复选框?
我有一个包含货运对象的网格表(数据提供者接受船舶对象的数组集合),并在网格表中显示出货和日期的名称。 我的ship对象有一个名为checkList的属性,它是一个布尔值,用作我复选框项目渲染器中的数据绑定(要使复选框勾号和取消勾选)
当我将Image对象添加到容器中时,我想检查我的复选框。 正在添加到容器的Image对象具有一个ID。 我想将该Image ID与我的shipId在数据网格表中匹配,并选中该特定记录的复选框。
所以我的Image对象监听添加事件,所以当Image对象被添加到容器时。 它调用addHandler()函数获取图像的id和通过数据网格表的循环来查找匹配的id并检查CheckBox。 我的循环工作很好。使用Alert.show()我可以看到它匹配的id和布尔值设置为true,复选框被勾选。 但是,复选框未勾选。
这些是我的代码。 即使该特定记录的checkList属性设置为true。 该复选框未勾选。 我不知道问题是什么。 我是一名学生,刚接触flex.Can有人能帮助我吗?
我的MXML视图:我的网格表
<s:DataGrid id="arrivalTable" x="-1" y="-1" width="302" height="205" requestedRowCount="4"
dataProvider="{myArrivalShips}" >
<s:columns>
<s:ArrayList>
<s:GridColumn dataField="shipName" headerText="Arrival Ships" itemRenderer="DesignItemRenderer.myCustomToolTipRenderer" width="130" ></s:GridColumn>
<s:GridColumn dataField="ETA" headerText="ETD" itemRenderer="DesignItemRenderer.myCheckBoxRenderer"></s:GridColumn>
</s:ArrayList>
</s:columns>
</s:DataGrid>
我的图像对象侦听添加事件。
displayImg.addEventListener(FlexEvent.ADD,addHandler);
这是我的addHandler()事件功能:
protected function addHandler(event:FlexEvent):void
{
var ImageShipId:String = Image(event.currentTarget).id;
var destination:BorderContainer = Image(event.currentTarget).owner as BorderContainer;
var destinationId:String = destination.id;
if( destinationId == "bct_HoldingArea" ){
for(var j:int = 0; j<arrivalTable.dataProvider.length; j++){
var myShip:Ship = arrivalTable.dataProvider.getItemAt(j) as Ship;
var myShipId:String = myShip.shipID.toString();
if(StringUtil.trim(myShipId) == StringUtil.trim(ImageShipId)){
myShip.checkList = true;
Alert.show("The ship name : " + myShip.shipName +"n" + "The Ship selected : " + myShip.checkList);
}
}
}
}
我的复选框项目渲染器:
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true">
<s:HGroup>
<s:Label text="{data.ETD}" paddingTop="8"/>
<s:CheckBox id="myCheckBox" enabled="false" selected="{data.checkList}" />
</s:HGroup>
更新对象后应使用数据提供者的“刷新”方法:
(arrivalTable.dataProvider as ArrayCollection).refresh();
所以你的函数看起来像这样:
protected function addHandler(event:FlexEvent):void
{
var ImageShipId:String = Image(event.currentTarget).id;
var destination:BorderContainer = Image(event.currentTarget).owner as BorderContainer;
var destinationId:String = destination.id;
if( destinationId == "bct_HoldingArea" ){
for(var j:int = 0; j<arrivalTable.dataProvider.length; j++){
var myShip:Ship = arrivalTable.dataProvider.getItemAt(j) as Ship;
var myShipId:String = myShip.shipID.toString();
if(StringUtil.trim(myShipId) == StringUtil.trim(ImageShipId)){
myShip.checkList = true;
(arrivalTable.dataProvider as ArrayCollection).refresh();
Alert.show("The ship name : " + myShip.shipName +"n" + "The Ship selected : " + myShip.checkList);
}
}
}
}
//编辑中间行的问题似乎是所谓的“中间行错误”。 我在这里找到了一些信息。
为了避免这种奇怪的事情,试着用这种方法来改变你的Renderer代码:
<?xml version="1.0" encoding="utf-8"?>
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true">
<fx:Script>
<![CDATA[
import mx.utils.ObjectUtil;
[Bindable]override public function get data():Object
{
return ObjectUtil.copy(super.data);;
}
override public function set data(value:Object):void
{
super.data = value;
}
]]>
</fx:Script>
<s:HGroup>
<s:Label text="{data.ETD}" paddingTop="8"/>
<s:CheckBox id="myCheckBox" enabled="false" selected="{data.checkList}"/>
</s:HGroup>
</s:GridItemRenderer>
//编辑
这个技巧的简短解释:我发现数据更新发生在除中间行以外的每一行。 我试图遵循数据网格的源代码。 我认为负责此操作的代码行是:
renderer.data = dataItem;
在GridLayout.as类中。
此行会为除中间行以外的每行更新数据。 为什么? Flex对这个表达式的两边进行比较,如果它们相等则不做任何事情。 在我们的情况下,它们不是平等的,但它似乎是一个真正的错误。 无论如何...我们需要等到Flex团队解决问题。
作为临时解决方法,我通过在“get”函数中克隆Object来残酷地改变表达式的左侧。 所以现在比较应该返回FALSE,并且应该为每一行更新数据属性。
设置的功能可以被删除,但它是调试相同问题的好地方。
这不是一个好方法,但总比没有好。
链接地址: http://www.djcxy.com/p/34647.html上一篇: How to check/tick a CheckBox in the item renderer?
下一篇: Flex item renderer