`
01jiangwei01
  • 浏览: 542259 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

flex 简单的增删改查 另外添加checkbox grid

FlexXMLF# 
阅读更多 
组件：components.MgmtGrid.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml"
		  width="100%"
		  height="100%"
		  creationComplete="init()">
	<mx:VBox width="100%"
			 height="100%">
		<mx:DataGrid width="100%"
					 height="100%"
					 styleName="{_gridStyleName}"
					 id="_grid"
					 dataProvider="{_dataAc}"
					 headerRelease="headerRelease(event)"/>
		<mx:HRule width="100%"
				  strokeWidth="1"
				  strokeColor="#CCCCCC"/>
		<mx:HBox borderStyle="none"
				 height="30"
				 width="100%"
				 horizontalGap="0"
				 paddingLeft="10"
				 paddingRight="10"
				 verticalAlign="middle">
			<mx:HBox borderStyle="none"
					 width="100%"
					 horizontalAlign="left"
					 id="_boxFuncBtn"/>
			<mx:Spacer width="100%"/>
			<mx:Text text="{'  第'+_pageIndex+'页/共'+_pageCount+'页'+'  共'+_totalRecord+'条记录'}"
					 fontWeight="{_pagerFontWeight}"
					 fontSize="{_pagerFontSize}"/>
			<mx:LinkButton id="_lbtnFirst"
						   label="首页"
						   click="_pageIndex=0;load();"
						   enabled="{_lbtnPrevious.enabled}"
						   fontWeight="{_pagerFontWeight}"
						   fontSize="{_pagerFontSize}"/>
			<mx:LinkButton id="_lbtnPrevious"
						   label="上一页"
						   click="_pageIndex--;load();"
						   enabled="{_pageIndex!=1?true:false}"
						   fontWeight="{_pagerFontWeight}"
						   fontSize="{_pagerFontSize}"/>
			<mx:LinkButton id="_lbtnNext"
						   label="下一页"
						   click="_pageIndex++;load();"
						   enabled="{_pageCount>(_pageIndex)?true:false}"
						   fontWeight="{_pagerFontWeight}"
						   fontSize="{_pagerFontSize}"/>
			<mx:LinkButton id="_lbtnLast"
						   label="尾页"
						   click="_pageIndex=_pageCount;load();"
						   enabled="{_lbtnNext.enabled}"
						   fontWeight="{_pagerFontWeight}"
						   fontSize="{_pagerFontSize}"/>
			<mx:NumericStepper id="_nsPageNum"
							   stepSize="1"
							   minimum="1"
							   maximum="{_pageCount}"
							   enabled="{_lbtnJump.enabled}"
							   value="{_pageIndex}"
							   fontWeight="{_pagerFontWeight}"
							   fontSize="{_pagerFontSize}"/>
			<mx:LinkButton id="_lbtnJump"
						   label="跳转"
						   click="_pageIndex=_nsPageNum.value;load();"
						   enabled="{_pageCount>1?true:false}"
						   fontWeight="{_pagerFontWeight}"
						   fontSize="{_pagerFontSize}"/>
		</mx:HBox>
	</mx:VBox>
	<mx:DataGridColumn sortable="false"
					   id="_columnCheckBox"
					   draggable="false"
					   width="50"
					   textAlign="center">
		<mx:headerRenderer>
			<mx:Component>
				<mx:CheckBox label="全选"
							 selected="{outerDocument._selectAll}"
							 click="outerDocument.clickAll(data)"/>
			</mx:Component>
		</mx:headerRenderer>
		<mx:itemRenderer>
			<mx:Component>
				<mx:CheckBox selected="{outerDocument.isSelected(data)}"
							 click="outerDocument.clickSingle(data)"/>
				<!-- <mx:CheckBox selected="{outerDocument.isSelected(data)}" click="data[outerDocument._selectedField] = !data[outerDocument._selectedField]"/> -->
			</mx:Component>
		</mx:itemRenderer>
	</mx:DataGridColumn>

	<!-- hide properties -->
	<mx:Metadata>
		[Exclude(name="_grid", kind="property")]
		[Exclude(name="_columnCheckBox", kind="property")]
		[Exclude(name="_boxFuncBtn", kind="property")]
		[Exclude(name="_lbtnFirst", kind="property")]
		[Exclude(name="_lbtnPrevious", kind="property")]
		[Exclude(name="_lbtnNext", kind="property")]
		[Exclude(name="_lbtnLast", kind="property")]
		[Exclude(name="_nsPageNum", kind="property")]
		[Exclude(name="_lbtnJump", kind="property")]
	</mx:Metadata>

	<mx:Script>
		<![CDATA[
			import mx.charts.BubbleChart;
			import mx.controls.Button;
			import mx.events.DataGridEvent;
			import mx.collections.ArrayCollection;

			[Bindable]
			private var _pageSize:int=20;
			[Bindable]
			private var _pageIndex:int=1;
			[Bindable]
			private var _pageCount:int=1;
			[Bindable]
			private var _totalRecord:int=0;
			[Bindable]
			private var _pagerFontWeight:String="normal";
			[Bindable]
			private var _pagerFontSize:int=12;
			[Bindable]
			private var _gridStyleName:String="";
			[Bindable]
			private var _enableCheckBox:Boolean=true;
			[Bindable]
			private var _gridColumns:Array=new Array();
			[Bindable]
			internal var _selectAll:Boolean=false;
			[Bindable]
			internal var _selectedField:String="selected";
			[Bindable]
			private var _dataAc:ArrayCollection=new ArrayCollection;

			private var _funcLoad:Function=null;
			private var _localSort:Boolean=true;
			private var _sortObject:Object=null;
			private var _btnDescs:Array=null;
			private var _btnStyleName:String="";
			private var _btnHandler:Function=null;

			/**
			 * 设置分页信息。<br>
			 * 在外部获取分页的信息，包括页数、当前页、所有记录数，然后告诉MgmtGrid进行显示。<br>
			 * @param pc 分页数(pageCount)
			 * @param pi 当前页码(pageIndex)，从1开始
			 * @param tr 所有记录数量（totalRecord)
			 * */
			public function setPageInfo(pc:int, pi:int, tr:int):void
			{
				this._pageCount=pc;
				this._pageIndex=pi;
				this._totalRecord=tr;
			}

			/**
			 * 设置分页大小，默认是20。<br>
			 * */
			public function set pageSize(ps:int):void
			{
				this._pageSize=ps;
			}


			/**
			 * 设置数据加载回调方法。系统会根据通过该方法通知外部获取数据，并给定数据相关参数。<br>
			 * 方法定义如下：<br>
			 * <code>function fun(ps:int, pi:int, so:Object)</code><br>
			 * 其中ps是分页大小，pi是当前页码，so是排序参数。<br>
			 * 排序参数是一个Object对象，拥有2个参数：<br>
			 * <ul>
			 * <li>index</li>排序列序号，指明用那列进行排序
			 * <li>desc</li>是否是升序，true表示升序，false表示降序
			 * 外部获取数据接口要根据这些参数向服务器请求数据<br>
			 * */
			public function set loadFunc(f:Function):void
			{
				this._funcLoad=f;
			}

			/**
			 * 是否本地排序。true的话，则不需要向服务器请求全局排序，只是利用flex自身的排序功能<br>
			 * 在当前显示页面排序。<br>
			 * */
			public function set localSort(lc:Boolean):void
			{
				this._localSort=lc;
			}


			/**
			 * 设置分页字体宽度，默认是normal。
			 * */
			public function set pagerFontWeight(w:String):void
			{
				this._pagerFontWeight=w;
			}

			/**
			 * 设置分页字体大小，默认是12。
			 * */
			public function set pagerFontSize(s:int):void
			{
				this._pagerFontSize=s;
			}

			/**
			 * 设置表格的式样名称。该式样将会影响表格的显示外观。
			 * */
			public function set gridStyleName(s:String):void
			{
				this._gridStyleName=s;
			}

			/**
			 * 是否需要显示复选框。显示复选框时，有全选功能，这个比较常用<br>
			 * 如果选择复选框，那么选中的数据项目根据复选框的状态来判断。<br>
			 * 如果没有复选框，那么选中的数据项目根据DataGrid选中的项目来判断。<br>
			 * */
			public function set enableCheckBox(b:Boolean):void
			{
				this._enableCheckBox=b;
			}

			/**
			 * 设置表格列DataGridColumn
			 * */
			public function set gridColumns(columns:Array):void
			{
				this._gridColumns=columns;
			}

			/**
			 * 设置选中列的标识。<br>
			 * 该项只有在enableCheckBox=true的时候有效。<br>
			 * 系统会根据这个字段来判断是否选中的状态。这个字段没有实际意义，<br>
			 * 不要与数据列冲突。<br>
			 * */
			public function set selectedField(s:String):void
			{
				this._selectedField=s;
			}

			/**
			 * 按钮描述。<br>
			 * 系统会根据按钮描述生成相关功能按钮，这些按钮被点击后，会触发<br>
			 * 按钮处理方法，用户可以根据处理方法里的按钮id执行相关操作。<br>
			 * 按钮描述对象有id、label、styleName几个字段。<br>
			 * */
			public function set btnDescs(arr:Array):void
			{
				this._btnDescs=arr;
			}

			/**
			 * 全局按钮样式名称。<br>
			 * 如果按钮描述对象里设置了样式名称，则根据按钮自己的样式绘制，<br>
			 * 否则根据全局按钮样式绘制。<br>
			 * */
			public function set btnStyleName(s:String):void
			{
				this._btnStyleName=s;
			}

			/**
			 * 设置按钮点击处理方法。<br>
			 * 该方法定义如下:<br>
			 * <code>function handler(id:String):void</code><br>
			 * id是被点击的按钮对应的id<br>
			 * */
			public function set btnHandler(f:Function):void
			{
				this._btnHandler=f;
			}

			/**
			 * 获得选中的数据项，如果选中多项，则返回第一项。<br>
			 * @return 返回第一个选中的项目，如果没有选中，则返回null
			 * */
			public function get selectedItem():Object
			{
				if (this._enableCheckBox)
				{
					for each (var o:Object in this._dataAc)
					{
						if (isSelected(o))
						{
							return o;
						}
					}
					return null;
				}
				return this._grid.selectedItem;
			}

			/**
			 * 获得选中的数据项。<br>
			 * @return 返回装有选中项的Array对象，如果没有选中项，则返回null
			 * */
			public function get selectedItems():Object
			{
				if (this._enableCheckBox)
				{
					var arr:Array=new Array;
					for each (var o:Object in this._dataAc)
					{
						if (isSelected(o))
						{
							arr.push(o);
						}
					}
					return arr.length == 0 ? null : arr;
				}
				return this._grid.selectedItems;
			}

			/**
			 * 增加一个数据项
			 * */
			public function addData(o:Object):void
			{
				this._dataAc.addItem(o);
			}

			/**
			 * 增加多个数据项
			 * @param o 多个数据项，必须是collection
			 * */
			public function addDatas(o:Object):void
			{
				for each (var d:Object in o)
				{
					addData(d);
				}
			}

			/**
			 * 删除数据项
			 * @param o 要删除的数据项
			 * */
			public function removeData(o:Object):void
			{
				var i:int=this._dataAc.getItemIndex(o);
				if (i >= 0)
				{
					this._dataAc.removeItemAt(i);
				}
			}

			/**
			 * 删除多个数据项
			 * @param o 要删除的数据项，必须为collection
			 * */
			public function removeDatas(o:Object):void
			{
				for each (var i:Object in o)
				{
					removeData(i);
				}
			}

			/**
			 * 更新数据字段
			 * @param o 要更新的数据
			 * @param field 数据的字段名
			 * @param v 新的字段值
			 * */
			public function updateData(o:Object, field:String, v:Object):void
			{
				var i:int=this._dataAc.getItemIndex(o);
				if (i >= 0)
				{
					o[field]=v;
					this._dataAc.itemUpdated(o, field, null, v);
				}
			}
			public function updateDataObj(oldItem:Object,newItem:Object):void
			{
				var i:int=this._dataAc.getItemIndex(oldItem);
				if (i >= 0)
				{
					for(var field in newItem)
					{
						oldItem[field]=newItem[field];
						this._dataAc.itemUpdated(oldItem, field, null, newItem[field]);
					}
				}
				
			}
			public function refresh():void
			{
				this._dataAc.refresh();
			}

			/**
			 * 如果组件不需要再使用，强烈建议调用destroy进行资源释放，<br>
			 * 以防内存泄漏。<br>
			 * */
			public function destroy():void
			{
				unInitButtons();
			}

			private function init():void
			{
				initColumns();
				initButtons();
				load();
			}

			private function initColumns():void
			{
				var arr:Array=new Array;
				if (this._enableCheckBox)
				{
					arr.push(this._columnCheckBox);
				}
				for each (var o:Object in this._gridColumns)
				{
					arr.push(o);
				}
				this._grid.columns=arr;
			}

			private function initButtons():void
			{
				if (this._btnDescs != null)
				{
					for each (var o:Object in this._btnDescs)
					{
						var btn:Button=new Button;
						btn.id=o.id;
						btn.label=o.label;
						btn.styleName=(o.styleName == undefined) ? this._btnStyleName : o.styleName;
						btn.addEventListener(MouseEvent.CLICK, onBtnClick);
						this._boxFuncBtn.addChild(btn);
					}
				}
			}

			private function unInitButtons():void
			{
				for each (var o:Object in this._boxFuncBtn.getChildren())
				{
					Button(o).removeEventListener(MouseEvent.CLICK, onBtnClick);
				}
			}

			private function onBtnClick(e:MouseEvent):void
			{
				if (e.currentTarget is Button)
				{
					if (this._btnHandler != null)
					{
						this._btnHandler(Button(e.currentTarget).id);
					}
				}
			}

			private function load():void
			{
				this._dataAc.removeAll();
				if (this._funcLoad != null)
				{
					this._funcLoad(this._pageSize, this._pageIndex, this._sortObject);
				}
			}

			internal function clickAll(data:Object=null):void
			{
				this._selectAll=!this._selectAll;
				for each (var o:Object in this._dataAc)
				{
					o[this._selectedField]=this._selectAll;
				}

				this._grid.invalidateList();
			}

			internal function clickSingle(data:Object=null):void
			{
				data[this._selectedField]=!isSelected(data);
				this._grid.invalidateList();
			}

			internal function isSelected(data:Object):Boolean
			{
				var v:Object=String(data[this._selectedField]);
				return v == "true";
			}


			private function headerRelease(event:DataGridEvent):void
			{
				if (!this._localSort)
				{
					var dc:DataGridColumn=DataGridColumn(event.itemRenderer.data);
					if (this._sortObject == null)
					{
						this._sortObject=new Object;
					}
					this._sortObject.index=this._enableCheckBox ? (event.columnIndex - 1) : event.columnIndex;
					this._sortObject.desc=dc.sortDescending;
					load();
				}
			}
		]]>
	</mx:Script>
</mx:Panel>



sample.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
				layout="vertical"
				xmlns:components="components.*"
				creationComplete="init()">
	<components:MgmtGrid id="grid"
						 width="80%"
						 height="400"
						 title="Hello"
						 styleName="ztGridPanel"
						 pagerFontSize="12"
						 gridColumns="{cols}"
						 enableCheckBox="true"
						 selectedField="selected"
						 localSort="false"
						 loadFunc="load"
						 pageSize="2"
						 btnDescs="{btnDescs}"
						 btnHandler="btnHandler"
						 btnStyleName="ztGridBtn"
						 gridStyleName="ztDataGrid">
	</components:MgmtGrid>
	<!---->
	<mx:Array id="cols">
		<mx:DataGridColumn headerText="Text"
						   dataField="label"
						   sortable="false"/>
		<mx:DataGridColumn headerText="Integer"
						   dataField="iv"/>
		<mx:DataGridColumn headerText="Long"
						   dataField="lv"/>
		<mx:DataGridColumn headerText="Boolean"
						   dataField="selected"/>
	</mx:Array>
	
	
	<mx:Style>
		.ztGridPanel {
		   borderColor: #0099ff;
		   borderAlpha: 1;
		   borderThicknessLeft: 1;
		   borderThicknessTop: 1;
		   borderThicknessBottom: 1;
		   borderThicknessRight: 1;
		   cornerRadius: 0;
		   headerHeight: 25;
		   backgroundAlpha: 1;
		   headerColors: #3399ff, #0066ff;
		   titleStyleName: "ztGridpanelTitle";
		   dropShadowEnabled: false;
		}

		.ztGridpanelTitle {
		   textAlign: center;
   		   fontFamily: Arial;
   		   fontSize: 13;
   		   font-weight:bold;
   		   color:#ffffff;
		}
		
		.ztDataGrid {
		   headerStyleName: "ztdataGridHeaderStyle";
		}

		.ztdataGridHeaderStyle {
		   color: #666666;
		   fontFamily: Arial;
		   fontSize: 12;
		   textAlign: center;
		   font-weight:bold;
		}
		.ztGridBtn {
			fontSize: 10;
			textAlign: center;
			font-weight:normal;
		}
	</mx:Style>
	<mx:Button click="func()"
			   label="Show Select"/>
	<mx:Button click="addFunc('add')"
			   label="Add"/>
	<mx:Script>
		<![CDATA[
			import components.MgmtGrid;
			import mx.controls.Alert;
			import mx.collections.ArrayCollection;
			import mx.managers.PopUpManager;
			[Bindable]
			private var btnDescs:Array=new Array({"id": "btnAdd", "label": "添加"}, {"id": "btnModify", "label": "修改"}, {"id": "btnDelete", "label": "删除"});
			
			[Bindable]   
            public var dgProvider:ArrayCollection; 

//			private var grid:MgmtGrid = new MgmtGrid;

			private function func():void
			{
				var arr:Object=grid.selectedItems;
				if (arr != null)
				{
					var index:int=0;
					for each (var o:Object in arr)
					{
						index++;
						trace(o.@label + " " + o.@iv + " " + o.@lv + " " + o.@selected);

					}
					Alert.show("您选择了" + index + "个元素", "title");
				}
			}


			//初始化表格数据
			/** ArrayCollection=new ArrayCollection;*/
			 private function initFunction():ArrayCollection
			 {
			 	var ret:ArrayCollection=new ArrayCollection;
			 	var prodIndex:int = 1;
			 	for (var z:int=0; z < 10; z++)   
                {   
                    var prod1:Object={};   
                    prod1.label=prodIndex * 7;   
                    prod1.iv=prodIndex; 
                    prod1.lv=prodIndex++; 
                    prod1.selected  =  prodIndex%2==0?"true":"false";
                  ret.addItem(prod1);
                   
                }
			 	return ret;
			 
			 }  
			
			private function init():void
			{
				
				//this._grid.dataProvider = xml.item;//
				//this._grid.dataProvider = new Array({"label":"Hello", "iv":"32", "lv":"32.00"}, {"label":"World", "iv":"31", "lv":"31.00"});
				//grid.addDatas(xml.item);
				//	this.grid.gridColumns = cols;
				//	this.grid.enableCheckBox = true;
				//	this.grid.styleName = "ztGridPanel";
				//	this.grid.btnDescs = btnDescs;
				//	this.grid.loadFunc = load;
				//	this.grid.selectedField = "@selected";
				//	this.addChild(this.grid);
			}

			private function addFunc(tFlag:String):void
			{
				
				var auWindow:AUSample =    
					AUSample(PopUpManager.createPopUp(this, AUSample, true));
					auWindow.title = tFlag=="add"?"添加窗口":"修改窗口";
					auWindow.flag = tFlag=="add"?"add":"mod";
					auWindow.parentAddRow = addRow;
					auWindow.parentModRow = modRow;
				 	PopUpManager.centerPopUp(auWindow);   
				
			}
			private function addRow(row:Object):void
			{
				this.grid.addData(row);
			}
			private function modRow(row:Object):void
			{
				var selectedItem :Object = this.grid.selectedItem ;
				if(selectedItem != null)
				{
					this.grid.updateDataObj(selectedItem,row);
				}
			}
			
			
			
			private function load(ps:int, pi:int, so:Object):void
			{
				trace(ps + " " + pi);
				if (so != null)
				{
					trace(so.index + "  " + so.desc);
				}
				var ret:ArrayCollection = initFunction();
				//this.grid.setPageInfo(allPage, nowPage, pagesize);
				this.grid.setPageInfo(2, 1, 4);
				this.grid.addDatas(ret);
			}

			private function btnHandler(id:String):void
			{
				if (id == "btnDelete")
				{
					var o:Object=this.grid.selectedItems;
					if (o != null)
					{
						this.grid.removeDatas(o);
					}
				}
				else if (id == "btnModify")
				{
					o=this.grid.selectedItem;
					if (o != null)
					{
						//this.grid.updateData(o, "@label", "new");
						addFunc("mod");
					}
				}
				else if (id == "btnAdd")
				{
					addFunc("add");
					
				}
			}
		]]>
	</mx:Script>
</mx:Application>




弹出窗口AUSample.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
				layout="absolute"
				width="348"
				height="308"
				fontSize="12"
				creationComplete="init()"
				>
	<mx:Script>
	   <![CDATA[
	   	import mx.managers.PopUpManager;
	   	import mx.controls.Alert;
	   	//初始化标志
	   	public var flag:String="";
	   	public var parentAddRow:Function;
	   	public var parentModRow:Function;
	   	
	   	public function init():void
	   	{
	   		if(flag == "mod")
	   		{
	   		label2.text = "mod";
	   		}
	   		else if(flag == "add")
	   		{
	   			label2.text = "add";
	   		
	   		}
	   	}
	   	
	   	 //确定键后  
	        public function setData():void
	        {
	        	var formObject:Object = new Object();
	        	formObject.label = label2.text;
	        	formObject.iv = iv.text;
	        	formObject.lv = lv.text;
	        	formObject.selected = selected.text;
	        	if(flag == "mod")
		   		{
		   			parentModRow(formObject);
		   		}
		   		else if(flag == "add")
		   		{
		   			
		   			parentAddRow(formObject);
		   		}
	        	
	        	 PopUpManager.removePopUp(this);
	        
	        }
	       //关闭窗口，同时刷新父窗口
	         private function Close():void{
	             PopUpManager.removePopUp(this);
	         }
	   
	    ]]>
     </mx:Script> 
	<mx:Form x="0"
			 y="0"
			 width="100%"
			 height="220">

		<mx:FormItem label="Text"
					 width="235">
			<mx:TextInput id="label2"/>
		</mx:FormItem>
		<mx:FormItem label="Integer"
					 width="235">
			<mx:TextInput id="iv"/>
		</mx:FormItem>
		<mx:FormItem label="Long"
					 width="235">
			<mx:TextInput id="lv"/>
		</mx:FormItem>
		<mx:FormItem label="Boolean"
					 width="235">
			<mx:TextInput id="selected"/>
		</mx:FormItem>
	</mx:Form>
	<mx:ControlBar height="40"
				   y="114"
				   horizontalAlign="right"
				   cornerRadius="0"
				   alpha="1.0">
		<mx:Button label="确定"
				   click="setData()"/>
		<mx:Button label="关闭"
				   click="Close()"/>
	</mx:ControlBar>
</mx:TitleWindow>

  • 大小: 10.3 KB
分享到：
| flex 视频播放器
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    flex AdvancedDataGrid实现checkBox全选功能

    这通常通过在界面上添加一个全选CheckBox来完成，当用户点击这个全选CheckBox时，遍历dataProvider并改变所有数据项的选中状态： ```actionscript private function handleSelectAll(event:Event):void { var ...

    Flex带CheckBox的多选 列表和表格

    首先，`CheckBoxList`是基于`List`组件的扩展，它为每个列表项添加了一个CheckBox。在`CheckBoxList.as`中，你可以看到如何自定义`List`的行为，例如设置CheckBox的样式、监听CheckBox的状态改变等。这通常涉及到对`...

    怎样在flex的datagrid中运用checkbox

    在实际应用中，我们经常需要在DataGrid的列中添加复选框（Checkbox），以便用户能够进行多选操作，例如全选和单选。本文将深入探讨如何在Flex的DataGrid中使用复选框，并实现全选和单选功能。 首先，我们需要在...

    flex datagrid 中实现combobox联动

    在Flex编程中，数据网格（DataGrid）是用于展示大量结构化数据的组件，而ComboBox是一种下拉选择框，常用于提供用户可选择的选项。当我们需要在DataGrid的不同列中实现ComboBox的联动效果时，即在一个ComboBox的选择...

    Jquery flexigrid插件 添加checkbox,(双击事件)onRowDblclick

    要实现这一功能，只需要在定义grid的参数中添加一个checkbox字段，并将其设置为true。这样，每个数据行前就会出现一个复选框供用户选择。示例代码如下： ```javascript $("#flex1").flexigrid({ url: 'getData....

    DataGrid和AdvancedDataGrid CheckBox全选功能1.1

    在本文中，我们将深入探讨如何在Flex中实现DataGrid和AdvancedDataGrid组件的CheckBox全选功能。这个功能在数据展示和交互式操作中非常常见，它允许用户通过一个主CheckBox来选择或取消选择所有行数据。 首先，我们...

    Flex Datagrid全选功能

    - **CheckBox**: 可以在Datagrid的头行添加一个CheckBox，当用户点击这个CheckBox时，所有的行将被选中或取消选中。为此，我们需要监听CheckBox的change事件，并在事件处理器中遍历Datagrid的所有数据项，设置它们...

    Flex课程学习（附带源码）

    Button、CheckBox、ColorPicker、DataGrid、DateField、HSlider、HorizontalList、Image、LinkButton Label、List MumericStepper、PopUpButton、ProgressBar、RadioButton、RichTextEditor、Text、TextArea、...

    FLex文档教程

    ### Flex文档教程精要 **一、Flex框架概览** Flex是Adobe系统开发的一个开源框架，主要用于构建跨平台的富互联网应用程序（RIA）。它结合了MXML（一种基于XML的标记语言）和ActionScript（基于ECMA 262的、强类型...

    GridRow实现HTML类似表单

    在这里，我们可以实例化`GridRow`并添加到容器中，然后在代码中配置每个单元格的组件和属性。例如： ```actionscript &lt;mx:GridRow&gt; &lt;/mx:GridRow&gt; &lt;mx:GridRow&gt; ^a-zA-Z0-9_@.\-+"/&gt; &lt;/mx:GridRow&gt; ...

    flex开发工具的学习.txt

    ### Flex开发工具学习知识点 #### 一、Flex基础与核心组件介绍 ##### 1. Flex简介 Flex是一种用于构建Web应用程序的技术，它结合了MXML（标记语言）、ActionScript（编程语言）以及强大的Adobe Flash Player运行...

    FlexGrid响应TAB按键

    FlexGrid是一款广泛应用于Windows Forms和.NET ...在实际开发中，根据项目需求，可能还需要对这个基础功能进行扩展，比如添加 Shift+Tab支持、处理Ctrl+Tab等快捷键，或者集成到更复杂的数据编辑和验证流程中。

    Flex UI组件使用全集

    - **Grid、GridItem、GridRow**: 表格布局及其相关的单元格和行。 - **HBox**: 水平方向布局的容器。 - **HDivideBox**: 水平方向可调整大小的容器。 - **Panel**: 带有标题和边框的容器。 - **TabNavigator**: 类似...

    《Flex 3 组件实例与应用（2009版）》（PDF）

    《Flex 3 组件实例与应用（2009版）》是一本深入解析Adobe Flex 3框架下组件使用与实践的专业书籍。本书由Dason精心整理于2009年2月，全面覆盖了Flex 3中的各种控件、容器、数据可视化组件以及效果、视图状态和过渡...

    Flex 3 组件实例与应用（2009版）

    - **Grid/GridItem/GridRow** - 表格容器及表格元素。 - **HBox** - 水平布局容器。 - **HDivideBox** - 水平分割容器。 - **Panel** - 面板容器。 - **TabNavigator** - 选项卡导航容器。 - **Title** - 标题容器。...

    CSS自定义复选框,单选框checkbox,radio的源代码_3种实现思想代码.zip

    第三种实现思想可能涉及更复杂的CSS技巧，如使用`+`或`~`兄弟选择器，或者使用`display: flex`或`display: grid`来布局。这种方法通常会创建一个容器元素，包含隐藏的原生输入元素和一个可视化的自定义元素。当输入...

    表单元素与提示文字无法对齐的解决方法(input,checkbox文字对齐）

    在网页设计中，表单是用户与网站交互的重要部分，其中元素如`input`输入框、`checkbox`复选框等通常需要与相应的提示文字保持对齐，以提供清晰、一致的用户体验。然而，由于浏览器默认样式的影响，这些元素与文字的...

    Developing Flex Applications 910p dda_doc88_cracker.zip

    CheckBox control . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 113 DateChooser. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ...

    一个简单的美化表单的实例

    4. **布局**：通过`display`属性（如`flex`或`grid`）调整表单元素的排列方式，使其适应不同的屏幕尺寸和设备类型，实现响应式设计。 5. **字体与颜色**：选择合适的字体家族、大小和颜色，使得表单文本易于阅读且...

Magicbox
Global site tag (gtag.js) - Google Analytics