在 Flex Datagrid 中添加分页的插件?

Posted

技术标签:

【中文标题】在 Flex Datagrid 中添加分页的插件?【英文标题】:Plugin to add pagination in a Flex Datagrid? 【发布时间】:2010-12-11 01:33:53 【问题描述】:

是否有库或插件可以添加到 Flex 项目中以向 Flex Datagrid 添加分页?

【问题讨论】:

【参考方案1】:

this paginated datagrid的源代码可以在here找到。

<?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" ></mx:ToggleButtonBar>
</mx:VBox>

</mx:Application>

【讨论】:

以上是关于在 Flex Datagrid 中添加分页的插件?的主要内容,如果未能解决你的问题,请参考以下文章

在使用 mpdf 库生成的 pdf 中添加分页符

如何在面向协议的网络中添加分页页面

如何使用 React 在 Fluent UI Detaillist 中添加分页

在角度js表中添加分页[重复]

如何使用 XSL-FO 在 PDF 中添加分页符?

如何在 ngx-datatable 中添加分页和页脚模板?