Flex中DataGrid绑定ComboBox ,自动显示行号，增加行，删除行，保存数据
<?xml version="1.0" encoding="utf-8"?><!-- Simple custom MXML TitleWindow component. The TitleWindowApp application displays this component. You cannot run it independently. --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" pageTitle="个人信息" width="100%" height="100%" borderColor="#00BEFF" cornerRadius="0" layout="absolute" x="200" y="100" fontSize="14" xmlns:components="*" creationComplete="init()" > <mx:Script> <![CDATA[ import mx.collections.ArrayCollection; import mx.collections.XMLListCollection; import mx.managers.PopUpManager; import mx.controls.Alert; public var comBoxXML: XML = <list> <way>手机</way> <way>邮箱</way> </list>; [Bindable] public var comBox:XMLListCollection=new XMLListCollection(comBoxXML.way); [Bindable] private var dataArr:ArrayCollection=new ArrayCollection(); var item1:Object={way:"手机",add:"1396907****"}; var item2:Object={way:"邮箱",add:"************"}; private function init():void { dataArr.addItem(item1); dataArr.addItem(item2); } /** * 关闭窗口 */ public function closeHandler():void { // isOpObj=false; PopUpManager.removePopUp(this); } import mx.collections.ArrayCollection; public var index:Number; //自动显示行号中得到行号 private function getLineNum(item:Object,num:int):String{ index = dataArr.getItemIndex(item)+1; return String(index); } //增加一条记录 private function addRecord():void { //Alert.show("add"); var item3:Object={}; dataArr.addItem(item3); dg.dataProvider=dataArr; } //删除一条记录 private function deleteRecord():void { //Alert.show("reduce"); var item4:Object=dg.selectedItem; var index:int=dataArr.getItemIndex(item4); dataArr.removeItemAt(index); dg.dataProvider=dataArr; } //保存信息 private function saveInfo():void { //当dataGrid输入有改变的时候，会自动反写到dataProvider中 var index:int=dataArr.length; //dataArr.removeAll(); Alert.show(index.toString()); for(var i=0;i<index;i++){ //var obj:Object=dg.getChildAt(i); Alert.show(dataArr.getItemAt(i).way); } } ]]> </mx:Script> <mx:Label x="20" y="35" text="个人信息：" fontSize="12"/> <mx:Label x="20" y="88" text="账号：" fontSize="12"/> <mx:Label x="281" y="88" text="姓名：" fontSize="12"/> <mx:HBox x="20" y="10" width="632"> <mx:Spacer width="100%" height="100%"/> <mx:Button label="保存" click="saveInfo();" fontSize="12" /> <mx:Button label="取消" click="closeHandler();" fontSize="12"/> </mx:HBox> <mx:Label x="20" y="129" text="性别：" fontSize="12"/> <mx:RadioButton x="83" y="127" label="男" fontSize="12"/> <mx:RadioButton x="139" y="127" label="女" fontSize="12"/> <mx:RadioButton x="194" y="127" label="未知" fontSize="12"/> <mx:Label x="281" y="129" text="生日：" fontSize="12"/> <mx:ComboBox x="348" y="124" width="60"></mx:ComboBox> <mx:ComboBox x="446" y="124" width="53"></mx:ComboBox> <mx:ComboBox x="537" y="124" width="57"></mx:ComboBox> <mx:Label x="416" y="129" text="年" fontSize="12"/> <mx:Label x="507" y="129" text="月" fontSize="12"/> <mx:Label x="602" y="129" text="日" fontSize="12"/> <mx:TextInput x="83" y="84" editable="false"/> <mx:TextInput x="348" y="84"/> <mx:DataGrid id="dg" x="20" y="157" width="632" height="191" editable="true" dataProvider="{dataArr}" > <mx:columns> <mx:DataGridColumn headerText="序号" dataField="num" labelFunction="getLineNum" editable="false" /> <mx:DataGridColumn headerText="联系方式" dataField="way" editorDataField="value" > <mx:itemEditor> <mx:Component> <mx:HBox> <mx:Script> <![CDATA[ public function get value():Object { if(cmb.selectedItem == null) return null; var item1 :XML = cmb.selectedItem as XML; var method1 : String = item1.children()[0]; //联系方式 data.way = method1; // data DataGrid上面的当前行的数据 return method1; } override public function set data(value:Object):void { //必须要给data复制，否则会导致程序崩溃 super.data=value; //给combobox赋初始值 for each(var item1 :XML in cmb.dataProvider) { trace(item1.children()[0]); var method2 : String = item1.children()[0]; if(method2 == value.way){ //value DataGrid上面的当前行的数据 cmb.selectedItem=item1; } } } //下面的 {outerDocument}标识引用外部的数据 在这里写注释比较方便：） ]]> </mx:Script> <mx:ComboBox id="cmb" labelField="方式" width="100%" dataProvider="{outerDocument.comBox}" /> </mx:HBox> </mx:Component> </mx:itemEditor> </mx:DataGridColumn> <mx:DataGridColumn headerText="联系地址" dataField="add"/> </mx:columns> </mx:DataGrid> <mx:HBox x="20" y="356" width="632"> <mx:Spacer width="100%" height="100%"/> <mx:Button label="增加" click="addRecord();" width="54" fontSize="12"/> <mx:Button label="删除" click="deleteRecord();" fontSize="12"/> </mx:HBox></mx:Application>