开发学院WEB开发ASP Flex分页控件 阅读

Flex分页控件

 2010-01-14 10:44:51 来源:WEB开发网   
核心提示:提到分页大家应该都很熟悉了,几乎所有的应用中都会用到,Flex分页控件,因而完成一个分页组件在不同的应用中进行复用是必须的,刚写完了一个flex分页的组件,默认为10 public function PageUtils(exeFun:Function,pageNum:int=10) { this.exeFun=exeF
提到分页大家应该都很熟悉了,几乎所有的应用中都会用到。因而完成一个分页组件在不同的应用中进行复用是必须的,刚写完了一个flex分页的组件,拿来分享一下。如果有什么建议、问题欢迎大家提出。希望可以为flex的开发者们提供一个可靠的分页组件。

                                                  

package utils.page

{

  import Flash.events.MouseEvent;

  

  import mx.controls.Button;

  import mx.controls.Label;

  

  //分页组件类

  //作者:孙镜涛

  //日期:2010-01-12

  //描述:本类主要负责对分页相关的按钮以及信息显示的标签进行管理;对数据显示内容进行控制

  public class PageComponent

  {

    //首页按钮

    PRivate var firstButton:Button;

    //下一页按钮

    private var nextButton:Button;

    //前一页按钮

    private var previousButton:Button;

    //最后页按钮

    private var lastButton:Button;

    //当前页信息显示

    private var curPageInfoLbl:Label;

    //所有页信息显示

    private var totalPageInfoLbl:Label;

    //当前页改变时数据处理方法

    private var handleDataFun:Function;

    //分页数据的处理类

    private var page:PageUtils;

    

    //first,next,previous,last:第一页,下一页,上一页,最后页的button

    //curPageInfoLbl,totalPageInfoLbl:当前页,所有页信息显示的label

    //handleDataFun:分页的页码改变后数据的处理函数,该函数符合的签名为:(data:Array):void

    //exeFun:查询数据的sql,该函数的签名为:(sql:String):Array

    //pageNum:每页显示数据条数

    public function PageComponent(first:Button,next:Button,previous:Button,last:Button,curPageInfoLbl:Label,

                   totalPageInfoLbl:Label,handleDataFun:Function,exeFun:Function,pageNum:int)

    {

      //分页按钮初始化

      this.firstButton=first;

      this.nextButton=next;

      this.previousButton=previous;

      this.lastButton=last;

      

      //分页信息显示控件初始化

      this.curPageInfoLbl=curPageInfoLbl;

      this.totalPageInfoLbl=totalPageInfoLbl;

      

      //页面改变后数据处理函数

      this.handleDataFun=handleDataFun;

      

      //分页数据类初始化

      this.page=new PageUtils(exeFun,pageNum);

      

      //为分页按钮增加相应的事件处理函数

      this.firstButton.addEventListener(MouseEvent.CLICK,firstButtonClicked);

      this.nextButton.addEventListener(MouseEvent.CLICK,nextButtonClicked);

      this.previousButton.addEventListener(MouseEvent.CLICK,previousButtonClicked);

      this.lastButton.addEventListener(MouseEvent.CLICK,lastButtonClicked);

    }

    

    //需要分页查询的的sql

    public function initSql(sql:String):void

    {

      this.page.initSqlAndInitDataIfNecessary(sql);    

      setButtonStatus();

      setLabelInfo();

      this.handleDataFun(page.getPageData());

    }



    //分页按钮被点击时的处理逻辑为:

    //1.设置当前数据的页数

    //2.设置分页控件按钮的状态

    //3.设置分页控件信息显示label的内容

    //4.查询该页数据并执行数据处理函数

    

    //点击第一页时触发的事件

    public function firstButtonClicked(event:MouseEvent):void

    {

      page.setCurrentPage(1);

      setButtonStatus();

      setLabelInfo();

      this.handleDataFun(page.getPageData());

    }

    

    //点击下一页时触发的事件

    public function nextButtonClicked(event:MouseEvent):void

    {

      if(page.getCurrentPage()<page.getPageCount())

      {

       page.setCurrentPage(page.getCurrentPage()+1);

      }

      setButtonStatus();

      setLabelInfo();

      this.handleDataFun(page.getPageData());

    }

    

    //点击上一页时触发的事件

    public function previousButtonClicked(event:MouseEvent):void

    {

      if(page.getCurrentPage()>1)

      {

       page.setCurrentPage(page.getCurrentPage()-1);

      }

      setButtonStatus();

      setLabelInfo();

      this.handleDataFun(page.getPageData());

    }

    

    //点击最后页时触发的事件

    public function lastButtonClicked(event:MouseEvent):void

    {

      page.setCurrentPage(page.getPageCount());

      setButtonStatus();

      setLabelInfo();

      this.handleDataFun(page.getPageData());

    }

    

    //设置所有分页按钮的状态为不可用

    private function setAllButtonStatusDisabled():void

    {

      this.firstButton.enabled=false;

      this.previousButton.enabled=false;

      this.nextButton.enabled=false;

      this.lastButton.enabled=false;

    }

    

    //设置分页按钮的状态

    //步骤为:

    //   1.首先设置所有分页按钮的状态为不可用

    //   2.判断是否需要启用某些分页按钮(仅当查询有数据并且数据页数大于一的时候才有必要)

    //     2.1如果需要启用某些按钮分为三种情况:

    //      2.1.1位于第一页那么下一页和最后页的按钮可用

    //      2.1.2位于中间页那么所有按钮可用

    //      2.1.3位于最后也那么上一页和第一页的按钮可用

    private function setButtonStatus():void

    {

      setAllButtonStatusDisabled();

      if(page.getTotalCount()>0&&page.getPageCount()>1)

      {

       if(page.getCurrentPage()==1)

       {

         this.nextButton.enabled=true;

         this.lastButton.enabled=true;

       }

       else if(page.getCurrentPage()<page.getPageCount()&&page.getCurrentPage()>1)

       {

         this.nextButton.enabled=true;

         this.firstButton.enabled=true;

         this.previousButton.enabled=true;

         this.lastButton.enabled=true;

       }

       else if(page.getCurrentPage()==page.getPageCount())

       {

         this.firstButton.enabled=true;

         this.previousButton.enabled=true;

       }       

      }

    }  

    

    //设置查询结果分页信息的label内容

    private function setLabelInfo():void

    {

      this.totalPageInfoLbl.text="共"+page.getPageCount()+"页";

      this.curPageInfoLbl.text="当前第"+page.getCurrentPage()+"页";

    }

    

  }

}







package utils.page

{

  import entity.ConsumptionRecord;

  

  //分页数据组件类

  //作者:孙镜涛

  //日期:2010-01-12

  //描述:本类主要负责对分页数据的状态进行控制,以及进行查询数据

  public class PageUtils

  {

    //查询数据的函数

    private var exeFun:Function;

    

    //分页查询的sql

    private var sql:String;

    //每页显示的记录条数

    private var pageNumber:int=0;

    //当前查询的记录总数

    private var totalCount:int=0;

    //当前所处的页数

    private var currentPage:int=0;

    //当前查询的记录总页数

    private var totalPage:int=0;

    

    public function getPageCount():int

    {

      return this.totalPage;

    }

    

    public function getTotalCount():int

    {

      return this.totalCount;

    }

    

    public function getCurrentPage():int

    {

      return this.currentPage;

    }

    

    public function setCurrentPage(pageNum:int):void

    {

      this.currentPage=pageNum;

    }

    

    //构造函数, exeFun为查询数据的函数,签名需要符合:(sql:String):Array

    //     pageNum为每页显示记录数,默认为10

    public function PageUtils(exeFun:Function,pageNum:int=10)

    {

      this.exeFun=exeFun;

      this.pageNumber=pageNum;

    }

    

    //初始化查询sql,如果必要那么进行分页数据的初始化

    //具体步骤为:

    //     1.如果本次查询和上次查询的sql不一样,那么进行分页数据初始化

    //     2.构造查询记录总数的sql

    //     3.根据查询记录总数的结果初始化本类的相关变量,如果没有返回结果那么使用默认值:0

    public function initSqlAndInitDataIfNecessary(sql:String):void

    {

      if(this.sql!=sql)

      {

       this.sql=sql;

       var countSql:String="SELECT COUNT(*) COUNT_NUMBER "+sql.substring(sql.indexOf("FROM"));

       var data:Array=exeFun(countSql);

       if(data!=null)

       {  

         //设置总条数

         this.totalCount=data[0].COUNT_NUMBER;

         //设置总页数

         this.totalPage=this.totalCount%this.pageNumber==0?this.totalCount/this.pageNumber:this.totalCount/this.pageNumber+1;

         //设置当前页

         this.currentPage=1;

       }  

      }

    }

    

    //获取分页数据的方法

    public function getPageData():Array

    {

      var tempSql:String=this.sql+getLimitOffsetSuffix(this.pageNumber,(this.currentPage-1)*this.pageNumber);

      return exeFun(tempSql);      

    }

    

    //为查询sql增加分页条件

    private function getLimitOffsetSuffix(limit:int,offset:int):String

    {

      return " LIMIT "+limit+" OFFSET "+offset;

    }



  }

}







使用该代码你需要做什么:

      //处理分页数据的方法

      private function bindDataToGrid(data:Array):void

      {

       //将数据绑定到DataGrid上

       dataGrid.dataProvider=data;

      }

      //执行数据查询的方法

      public static function execute(sql:String):Array

      {   

        sqlStatement.text=sql;

        sqlStatement.execute();

        return sqlStatement.getResult().data;

      }

      //查询条件改变时执行的方法

      private function searchConditionChanged():void

      {

//初始化分页组件

var pageComponent:PageComponent=new

PageComponent(firstBtn,nextBtn,previousBtn,lastBtn,lblCurrentPage,lblTotalPage,bindDataToGrid,execute,20);    

var sql:String=”select name id from users”;

//初始化查询sql

       pageComponent.initSql(sql);      

      }

Tags:Flex 控件

编辑录入:爽爽 [复制链接] [打 印]
[]
  • 好
  • 好的评价 如果觉得好,就请您
      0%(0)
  • 差
  • 差的评价 如果觉得差,就请您
      0%(0)
更多精彩
    赞助商链接

    热点阅读
      焦点图片
        最新推荐
          精彩阅读