Flex使用Repeater创建checkbox组

使用Repeater创建checkbox组并默认选中给出选中的结果

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
??????? layout="vertical"
??????? verticalAlign="middle"
??????? backgroundColor="white" creationComplete="init()">

??? <mx:Style>
??????? Alert {
??????????? backgroundAlpha: 0.8;
??????????? backgroundColor: black;
??????????? borderAlpha: 0.8;
?????????? borderColor: black;
??????? }
??? </mx:Style>

??? <mx:Script>
??????? <![CDATA[
??????????? import mx.controls.Alert;
??????????? import mx.controls.RadioButton;
??????????? import mx.collections.ArrayCollection;
????? //定义? Repeater要绑定的数据即用来添加checkbox? 模拟所有的操作
????? private var roleFields:ArrayCollection = new ArrayCollection([{name:"编号",field:"id",link:"false"}
??????????????????????????????????????,{name:"角色名",field:"roleName",link:"true"}
?????????????????????????????????????,{name:"操作",field:"删除角色",link:"false"}]);
????? //默认选择的checkbox的集合? 模拟用户有的操作
????? private var role:ArrayCollection = new ArrayCollection([{name:"编号",link:"false"}
?????????????????????????????????????????,link:"false"}]);
??? //全选操作
???? private function selectAll(event:Event):void {
??? var target:CheckBox = event.currentTarget as CheckBox;
??? var i:uint;
??? if(target.selected){
????
???? for(i=0;i<roleFields.length;i++) {
???? checkBox[i].selected=true;
???? }
??? }else {
???? for(i=0;i<roleFields.length;i++) {
????? checkBox[i].selected=false;
???? }
??? }
?? }
?? private function init():void {
???????? if(role != null && roleFields != null) {
????????? //当前角色所拥有的操作的循环
?????? for(var i:uint=0;i<role.length;i++){
??????? //所有的操作的循环
??????? for(var j:uint=0;j<roleFields.length;j++){
???????? //如果checkbox的data是当前角色拥有的操作的id则check选中
???????? if(role[i].field == checkBox[j].data){
????????? checkBox[j].selected=true;
???????? }
??????? }
?????? }
???????? }
??????? }
??????? //选择的内容
??????? private function selectedContext():void {
???????? var context:String = "";
???????? if(roleFields != null ) {
????????? for(var i:uint=0;i<roleFields.length;i++) {
?????????? //如果checkbox被选中把选中的内容记录下来
?????????? if(checkBox[i].selected) {
??????????? context = context+","+checkBox[i].data;
?????????? }
????????? }
???????? }
???????? Alert.show(context);
??????? }
??????? ]]>
??? </mx:Script>

??? <mx:Array id="arr">
??????? <mx:Object label="Red" data="red" />
??????? <mx:Object label="Orange" data="haloOrange" />
??????? <mx:Object label="Yellow" data="yellow" />
??????? <mx:Object label="Green" data="haloGreen" />
??????? <mx:Object label="Blue" data="haloBlue" />
??? </mx:Array>

? <mx:Panel id="panel" width="50%" paddingLeft="10" verticalGap="10">
?????? <mx:Repeater id="checkBoxRepeater" dataProvider="{roleFields}">
??????????? <mx:CheckBox id="checkBox"
??????????????????? label="{checkBoxRepeater.currentItem.name}"
?????????????????? data="{checkBoxRepeater.currentItem.field}"
?????????????????? />
??????? </mx:Repeater>
??????? <mx:ControlBar horizontalAlign="right">
??????????? <mx:CheckBox label="全选" click="selectAll(event)" selected="false"/>
??????????? <mx:Button id="button" label="Click me"? click="selectedContext()"/>
??????? </mx:ControlBar>
??? </mx:Panel>

</mx:Application>

//询grid显示列表权限list回调函数
private function getGridroleListHandler(result:Object):void {
?if (null == result) {
??this.checkBox.selected = true;
??return;
?}
?gridbean = result as DbGridrole;
?//得到当前登录人所拥有的权限
?var gridrole:String = gridbean.gridrole;
?if (!AdvancedStringUtil.isNull(gridrole)) {
??role = gridrole.split(',');
??gridinit(); //表格初始化
?}
}

/**
?*表格初始化
?**/
private function gridinit():void {
?var selectedstr:String = "";
?var unselectedstr:String = "";
?if (role != null && roleFields != null) {
??//当前角色所拥有的操作的循环
??for (var i:uint = 0; i < role.length; i++) {
???//所有的操作的循环
???for (var j:uint = 0; j < roleFields.length; j++) {
????//如果checkbox的data是当前角色拥有的操作的id则check选中
????if (role[i] == checkBox[j].data) {
?????checkBox[j].selected = true;
?????selectedstr = selectedstr + "," + j;
?????break;
????}
???}
??}
?}

?var rolearray:Array = selectedstr.substr(1,selectedstr.length).split(',');
?//循环选中的grid列
?for (var z:uint = 0; z < rolearray.length; z++) {
??grid.columns[rolearray[z]].visible = true;
?}

?var unselectedarray:Array = new Array(); //= unselectedstr.substr(1,unselectedstr.length).split(',');
?//循环选中的grid列得到未被选中的gird列数组
?for (var z:uint = 0; z < roleFields.length; z++) {
??unselectedarray.push(z);
?}
?var pos:int = 0;
?for (var t:uint = 0; t < rolearray.length; t++) {
??for (var j:uint = 0; j < roleFields.length; j++) {

???if (j == rolearray[t]) {
????pos = unselectedarray.indexOf(j); //得到以选中元素在数组中的位置
????unselectedarray.splice(pos,1); //删除该元素
???}
??}
?}
?//把未被选中的grid列设为隐藏
?for (var k:uint = 0; k < unselectedarray.length; k++) {
??grid.columns[unselectedarray[k]].visible = false;
?}
}

//选择的内容
private function selectedContext():void {
?var context:String = "";
?if (roleFields != null) {
??for (var i:uint = 0; i < roleFields.length; i++) {
???//如果checkbox被选中把选中的内容记录下来
???if (checkBox[i].selected) {
????context = context + "," + checkBox[i].data;
???}
??}
?}
?selectedCheckbox = context.substr(1,context.length);
?gridbean.person = userid;
?gridbean.mgrPath = mgrPath;
?gridbean.gridrole = selectedCheckbox;
?//保存表格设置
?PaymentAction.saveGridroleInfo(gridbean);
}

/**
?* grid设置checkbox选中函数
?*/
private function tileItemCheckBox(event:Event):void {
?if (event.target.selected) {
??event.currentTarget.getRepeaterItem().visible = true;
?} else {
??event.currentTarget.getRepeaterItem().visible = false;
?}
}

/**
?* 保存grid设置信息回调函数
?*/
private function saveGridroleInfoHandler(result:Object):void {
?var returnCode:int = int(result);
?if (returnCode == 0) {
??Alert.show("保存设置成功！","提示信息");
??this.queryAction();
?} else if (returnCode == -1) {
??Alert.show("保存设置失败！","错误信息");
?}
}

?<mx:Tile width="98%" ???? height="45" ???? borderColor="#ffffff" ???? paddingLeft="5" ???? horizontalGap="1" ???? verticalGap="1" ???? borderStyle="solid" ???? borderThickness="1" ???? cornerRadius="5"> ???<mx:Repeater id="rp" ?????? dataProvider="{grid.columns}" ?????? width="100%"> ????<mx:CheckBox id="checkBox" ??????? label="{rp.currentItem.headerText}" ??????? data="{rp.currentItem.headerText}" ??????? change="tileItemCheckBox(event)"> ????</mx:CheckBox> ???</mx:Repeater> ??</mx:Tile>