5
Flex Datagrid'e sayfalandırma eklemek için bir Flex projesine eklenebilecek bir kitaplık veya eklenti var mı?Flex Datagrid'de sayfalama ekleme eklentisi?
Flex Datagrid'e sayfalandırma eklemek için bir Flex projesine eklenebilecek bir kitaplık veya eklenti var mı?Flex Datagrid'de sayfalama ekleme eklentisi?
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>