Flex中DataGrid使用列中放Button

来源:互联网 发布:外贸免费cms系统 编辑:程序博客网 时间:2024/05/17 06:09

Flex 中使用DataGrid,让其中的某些列可以编辑,并在最后一列放按钮,单击保存修改。效果如下:

其中价格是可以编辑的,其他不可编辑。点击按钮之后将数据更新到服务器。代码如下:

<mx:DataGrid x="0" y="0" height="80%" width="100%" dataProvider="{DP}" id="producesell" editable="true"><mx:columns><mx:DataGridColumn headerText="名称" dataField="name" editable="false"/><mx:DataGridColumn headerText="数量" dataField="volume" editable="false"/><mx:DataGridColumn headerText="价格(元/千克)" dataField="price" editable="true"></mx:DataGridColumn><mx:DataGridColumn headerText="确认价格" editable="false"><mx:itemRenderer><fx:Component><mx:VBox><!--parentDocument很牛B的办法 --><s:Button label="确认" id="produceConfirmButton" width="50" click="parentDocument.produceConfirmButton_clickHandler(event)"/></mx:VBox></fx:Component></mx:itemRenderer></mx:DataGridColumn></mx:columns></mx:DataGrid>
editable="true"使DataGrid的每一列都可以编辑,如果某一列不想被编辑,如编号一般都不会允许编辑,就用editable="false"设定,这样单击某单元格,就可以编辑了,编辑完毕之后单击确认,提交到数据库。代码如下:
public function produceConfirmButton_clickHandler(event:MouseEvent):void{var id:int=producesell.selectedItem.id;var str:String=producesell.selectedItem.price;if(str==null||str=="")Alert.show("请输入价格","提示");else{str=str.replace(/^\s*|\s*$/g,"");if(Number(str).toString()!="NaN"){var price:Number=(Number)(str);commUserservice.updatePriceFromWarehouse(id,price);}else{Alert.show("价格必须为数字","提示");}}}

注意:click="parentDocument.produceConfirmButton_clickHandler(event)",因为我将Button的clickHandler代码块移动到了主<fx:Script>标记中。dataProvider指定DataGrid的数据源,可以为一个XML文件,也可以用一个ArrayCollection对象,后者比较灵活,ArrayCollection中存放一系列对象,对象的属性的个数不能少于DataGrid的列数,不然没法给每一列绑定数据域,可以将ArrayCollection中存放的对象的某些属性赋给DataGrid的列,其它保留。dataField="name" 指定该列显示的数据来自哪里,此处为ArrayCollection中存放的对象的name属性。

	
				
		
原创粉丝点击