Flex服务端分页

阅读更多

Structure:
model
    event
        PaginationEvent.as
    vo
        IPageable.as
        PaginatedResults.as
view
    paginationBarImg(folder)
    PaginationBar.mxml
    PaginationImgBar.mxml


Souce code:

package model.event
{
	import flash.events.Event;
	
	public class PaginationEvent extends Event
	{
		public static var PAGE_CHANGED:String="pageChanged";
		public static var DATA_SORTED:String="dataSorted";
		public static var DATA_FILTERED:String="dataFiltered";
		
		public var searchCriteria:Object;
		public var pageNumber:int;
		public var recordsPerPage:int;
		public var sortable:Boolean = false;
		public var sortField:String = "";
		public var isAscendSort:Boolean = true;
		public var filterField:String = "";
		public var filterValue:String = "";
		
		public function PaginationEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false){
			super(type, bubbles, cancelable);
		}
		
		/**
		 * Please override the clone method if the event need to be redispatched, because
		 * when redispatching an event, a clone event will be created automatically using this method.
		 */ 
		override public function clone():Event {
			var e:PaginationEvent = new PaginationEvent(type, bubbles, cancelable);
			e.searchCriteria=searchCriteria;
			e.pageNumber = pageNumber;
			e.recordsPerPage = recordsPerPage;
			e.sortable = sortable;
			e.sortField = sortField;
			e.isAscendSort= isAscendSort;
			e.filterField = filterField;
			e.filterValue = filterValue;
			return e;
		}
		
	}

}

package model.vo
{
	public interface IPageable
	{
		function toFirstPage():void;
		function toLastPage():void;
		function toNextPage():void;
		function toPreviousPage():void;
		function toSelectedPage(selectedPage:int):void;
		function get totalPages():int;
		function get totalRecords():int;
	}
}

package model.vo
{
	import model.event.PaginationEvent;
	
	import flash.events.Event;
	import flash.events.EventDispatcher;
	
	import mx.collections.ArrayCollection;
	import mx.controls.Alert;
	
	/**
	 * Service side will return a new PaginatedResults object for each search with only setting the value of totalPages and resultSet, 
	 * so we need to reset the value of selectedPage, recordsPerPage and searchCriteria at flex side.

	 * 
	 * 
There are two classes for implementing pagination: PaginationBar.mxml and PaginatedResults, and usually you need to make two calls:

	 * 1) make the initial call to set the results of the first page to your target.

	 * 2) make the second call to set the results of the requested page to your target.

	 * 
	 * 
Please ensure to invoke method:resetToolBar after invoking the setter methods: selectedPage and recordsPage, 
	 * otherwise the tool bar may not update to proper status, currently resetToolBar is invoked inside PaginationBar, and you only need to remember
	 * to reset the value of other 3 required parameters mentioned above.
	 */ 
	public class PaginatedResults extends EventDispatcher implements IPageable
	{
		public static const DEFAULT_PAGE_NUMBER:int=1;
		public static const DEFAULT_PAGE_SIZE:int=10;
		public var alertCapturedErrorInfo:Boolean=false;
		
		[Transient]
		private var _searchCriteria:Object;
		
		[Transient]
		private var _selectedPage:int;
		[Transient]
		private var _totalRecords:int;
		
		private var _totalPages:int;
		
		[Transient]
		private var _recordsPerPage:int;//same meaning as pageSize
		
		[Bindable]
		[Transient]
		public var recordsPerPageComboBoxSeletedIndex:int;
		
		[Bindable]
		[Transient]
		public var selectedPageComboBoxSeletedIndex:int;
		
		[Transient]
		[Bindable]
		public var availablePageRange:ArrayCollection=new ArrayCollection();
		
		[Transient]
		[Bindable]
		public var availabeRecordsPerPageRange:ArrayCollection=new ArrayCollection([10,20,30,40,50,60,80,100,150,200,500]);
		
		public var resultSet:Object;
		
		[Bindable] public var enableToFirstPage:Boolean=false;
		[Bindable] public var enableToLastPage:Boolean=false;
		[Bindable] public var enableToNextPage:Boolean=false;
		[Bindable] public var enableToPreviousPage:Boolean=false;
		[Bindable] public var enableRecordsPerPageRange:Boolean=false;
		[Bindable] public var enableAvailablePageRange:Boolean=false;
		[Bindable] public var enableRefresh:Boolean=false;
		
		[Bindable]public var pageNumberStatus:String="0/0";
		
		
		public function PaginatedResults(recordsType:String=null){
			this._selectedPage=DEFAULT_PAGE_NUMBER;
			this._recordsPerPage=DEFAULT_PAGE_SIZE;
		}
		
		/**
		 * This function should be called after reset the value of selectedPage and recordsPerPage,
		 * Otherwise, PaginationBar may not update to the right status.
		 */ 
		public function resetToolBar():void{
			resetSelectedPageCombBoxSeletedIndex();
			resetRecordsPerPageComboBoxSeletedIndex();
			resetNavigationButton();
		}
		
		private function resetAvailablePageRange():void{
			if(this.availablePageRange==null)
				this.availablePageRange=new ArrayCollection();
			if(this._totalPages>0){
				this.availablePageRange.removeAll();
				for(var i:int=0;i0){
				this.enableToFirstPage=true;
				this.enableToLastPage=true;
				this.enableAvailablePageRange=true;
				this.enableRecordsPerPageRange=true;
				this.enableRefresh=true;
			}else{
				this.enableToFirstPage=false;
				this.enableToLastPage=false;
				this.enableAvailablePageRange=false;
				this.enableRecordsPerPageRange=false;
				this.enableRefresh=false;
			}
			
			if(this._selectedPage==this.totalPages)
				this.enableToLastPage=false;
			if(this._selectedPage==1)
				this.enableToFirstPage=false;
			
			if(this._selectedPage=2){
				this.enableToPreviousPage=true;
			}else{
				this.enableToPreviousPage=false;
			}				
		}
				
		private function updatePageNumberStatus():void{
			this.pageNumberStatus=this._selectedPage+"/"+this._totalPages;
		}
		
		public function refresh():void{
			dispatchPaginationEvent();
		}
		
		public function toNextPage():void
		{
			if(this._selectedPage==this._totalPages){
				toLastPage();
			}else{
				toSelectedPage(this._selectedPage+1);
			}
		}
		
		public function toPreviousPage():void
		{
			if(this._selectedPage==1){
				toFirstPage();
			}else{
				toSelectedPage(this._selectedPage-1);
			}
			
		}
		
		public function toFirstPage():void
		{
			toSelectedPage(1);
			
		}
		
		public function toLastPage():void
		{
			toSelectedPage(this._totalPages);
			
		}
		
		public function toSelectedPage(selectedPage:int):void{
			this._selectedPage=selectedPage;
			dispatchPaginationEvent();
		}
		
		/**
		 * Please set value to recordsPerPage manually, because server don't return recordsPerPage to flex though flex will send recordsPerPage to server.
		 */ 
		public function set recordsPerPage(recordsPerPage:int):void{
			this._recordsPerPage=recordsPerPage;
		}
		
		/**
		 * each time server will return us a new PaginatedResults object, which will result in the default index to be set in PaginationBar's UIComponent,
		 * so we need to manually update UIComponent's selectedIndex to the proper value.
		 */ 
		private function resetRecordsPerPageComboBoxSeletedIndex():void{
			var index:int=this.availabeRecordsPerPageRange.getItemIndex(this._recordsPerPage);
			if(index!=-1){
				this.recordsPerPageComboBoxSeletedIndex=index;
			}else{
				this.recordsPerPageComboBoxSeletedIndex=0;
			}
		}
		
		private function resetSelectedPageCombBoxSeletedIndex():void{
			var index:int=this.availablePageRange.getItemIndex(this._selectedPage);
			if(index!=-1){
				this.selectedPageComboBoxSeletedIndex=index;
			}else{
				this.selectedPageComboBoxSeletedIndex=0;
			}
		}
		
		public function get recordsPerPage():int{
			return this._recordsPerPage;
		}
		
		/**
		 * Change UIComponent directly, no new PaginatedResults object has been set to PaginatinoBar, so don't need to manually update the selectedIndex.
		 */ 
		public function resetRecordsPerPage(recordsPerPage:int):void{
			this._recordsPerPage=recordsPerPage;//Don't use setter method:this.recordsPerPage, otherwise may cause infinite loop value set
			this._selectedPage=1;
			dispatchPaginationEvent();	
		}
		
		private function dispatchPaginationEvent():void{
			try{
				if(this._searchCriteria!=null){
					var newEvent:PaginationEvent=new PaginationEvent(PaginationEvent.PAGE_CHANGED);
					newEvent.pageNumber=this._selectedPage;
					newEvent.recordsPerPage=this._recordsPerPage;
					newEvent.searchCriteria=this._searchCriteria;
					this.dispatchEvent(newEvent);
				}else{
					Alert.show("SearchCriteria is null.","Message");
				}
			}catch(error:Error){
				if(alertCapturedErrorInfo){
					Alert.show("PaginatedResults->dispatchPaginationEvent error:"+error.message,"Error");
				}
			}
		}
		
		[Bindable]
		public function get totalPages():int
		{
			return this._totalPages;
		}
		
		public function set totalPages(totalPages:int):void
		{
			this._totalPages=totalPages;
			resetAvailablePageRange();
			updatePageNumberStatus();
		}
		
		[Bindable]
		public function get totalRecords():int
		{
			return this._totalRecords;
		}
		
		public function set totalRecords(totalRecords:int):void
		{
			this._totalRecords=totalRecords;
		}
		
		[Bindable]
		public function get selectedPage():int
		{
			return this._selectedPage;
		}
		
		/**
		 * Please set value to selectedPage manually, because server don't return selectedPage to flex though flex will send selectedPage to server.
		 */ 
		public function set selectedPage(selectedPage:int):void
		{
			this._selectedPage=selectedPage;
			updatePageNumberStatus();
		}
		
		/**
		 * Please set value to searchCriteria manually, because server don't return searchCriteria to flex though flex will send searchCriteria to server.
		 */ 
		public function set searchCriteria(searchCriteria:Object):void{
			this._searchCriteria=searchCriteria;
		}
		
		public function get searchCriteria():Object{
			return this._searchCriteria;
		}
		
		override public function toString():String{
			return "PaginatedResults["
				+"selectedPage:"+this._selectedPage
				+",recordsPerPage:"+this._recordsPerPage
				+",totalPages:"+this._totalPages
				+",totalRecords:"+this._totalRecords
				+",searchCriteria:"+this._searchCriteria
				+"]"
				+"\n"+super.toString();
		}
	}
}

PaginationBar.mxml

	
		[Event(name="pageChanged", type="model.event.PaginationEvent")]
		[Event(name="dataSorted", type="model.event.PaginationEvent")]
		[Event(name="dataFiltered", type="model.event.PaginationEvent")]
	
	
		
	
	
		
		
		
		
		
	
	
	
	

	
	
	
		
		

	
	
	
	

PaginationImgBar