2009-10-28 15 views

cevap

5

this paginated datagrid için kaynak kodu here bulunabilir.

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="InitApp()" xmlns:MyComp="*"> 
<mx:Script> 
    <![CDATA[ 
     import mx.collections.ArrayCollection; 
     import mx.events.ItemClickEvent; 
     import mx.controls.Button; 
     import mx.controls.Alert; 

     [Bindable] 
     public var myData:ArrayCollection = new ArrayCollection(); 
     public var orgData:ArrayCollection = new ArrayCollection(); 
     [Bindable] 
     public var nav:ArrayCollection = new ArrayCollection(); 
     public var pageSize:uint = 10; 
     public var navSize:uint = 10; 
     private var index:uint = 0; 
     private var navPage:uint = 1; 

     private function InitApp():void 
     { 
      for(var x:uint = 1; x <= 500; x++) 
      { 
       var obj:Object = new Object(); 
       obj.Id = x.toString(); 
       obj.Name = "Column " + x.toString(); 
       obj.Street = "5555 Street"; 
       obj.Title = "CEO"; 
       obj.City = "El Paso"; 

       orgData.addItem(obj); 
      } 
      refreshDataProvider(index); 
      createNavBar(Math.ceil(orgData.length/pageSize)); 
     } 

     private function createNavBar(pages:uint = 1,set:uint = 0):void 
     { 
      nav.removeAll(); 
      if(pages > 1) 
      { 
       if(set != 0) 
       { 
        nav.addItem({label:"<<",data:0}); 
        if((set - navSize) >= 0) 
        { 
         nav.addItem({label:"<",data:set - navSize}); 
        } 
        else 
        { 
         nav.addItem({label:"<",data:0}); 
        } 
       } 

       for(var x:uint = 0; x < navSize; x++) 
       { 
        var pg:uint = x + set; 
        nav.addItem({label: pg + 1,data: pg}); 
       } 
       if(pg < pages - 1) 
       { 
        nav.addItem({label:">",data:pg + 1}); 
        nav.addItem({label:">>",data:pages - pageSize}); 
       } 
      } 
     } 

     private function navigatePage(event:ItemClickEvent):void 
     { 
      refreshDataProvider(event.item.data); 
      var lb:String = event.item.label.toString(); 
      if(lb.indexOf("<") > -1 || lb.indexOf(">") > -1) 
      { 
       createNavBar(Math.ceil(orgData.length/pageSize),event.item.data); 
       if(event.item.data == 0) 
       { 
        pageNav.selectedIndex = 0; 
       } 
       else 
       { 
        pageNav.selectedIndex = 2; 
       } 
      } 

     } 

     private function refreshDataProvider(start:uint):void 
     { 
      myData = new ArrayCollection(orgData.source.slice((start * pageSize),(start * pageSize) + pageSize)); 
     } 
    ]]> 
</mx:Script> 
<mx:VBox verticalGap="0"> 
    <mx:DataGrid id="dg" dataProvider="{myData}"></mx:DataGrid> 
    <mx:ToggleButtonBar id="pageNav" itemClick="navigatePage(event)" dataProvider="{nav}" width="{dg.width}"></mx:ToggleButtonBar> 
</mx:VBox> 

</mx:Application>