首页 > 代码库 > flex分页2 新新的，一页多次调用互相不冲突
flex分页2 新新的，一页多次调用互相不冲突
直接先上源码;
分页组件Pager.mamx
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" creationComplete="initHandler(event)"
xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%" verticalAlign="middle">
<!--
/**
这里注意，有四个重要的参数需要传递：
1.pageSize:页面大小，每页显示多少条刻录,如果不传递，则按每页10条显示;
2.destination:服务名称，具体可以参考代码；
3.methodName:服务调用的方法，具体可以参考代码
4.datagrid:使用分页的datagrid
<p>
<code>
<control:PagingBar id="serverPagingBar1" url="USER_DATAGRID" datagrid="{userAdg}" pageSize="3"
destination="userFlexServices" methodName="getUsers" height="26" width="100%" />
</code>
</p>
*/
-->
<fx:Script>
<![CDATA[
import com.gwtjs.events.PagerEvent;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.controls.DataGrid;
import mx.events.FlexEvent;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.rpc.remoting.RemoteObject;
import spark.events.IndexChangeEvent;
[Bindable]//记录数
private var _items:ArrayCollection;
[Bindable]//分页参数
private var _params:Array = new Array();
[Bindable]//每页显示的条数
private var pageSizeBoxListData:ArrayCollection = new ArrayCollection([
{pageSize:10},
{pageSize:20},
{pageSize:30},
{pageSize:50},
{pageSize:100}
]);
[Bindable]//每页显示的记录数
public var pageSize:int = 10;
[Bindable]//当前页
public var curpage:int = 1;
[Bindable]//下一页到多少记录数
public var _offset:int = 1;
[Bindable]//总页数
public var totalPage:int = 0;
[Bindable]//总记录数
private var _allRecorders:int = 263;
private var _destination:String;
private var _methodName:String;
[Bindable]//组件宽度
public var widthTo:int;
//服务请求地址
public var url:String;
[Bindable]//datagrid
private var _datagrid:DataGrid;
public function get offset():int
{
return _offset;
}
public function set offset(value:int):void
{
_offset = value;
}
public function get datagrid():DataGrid
{
return _datagrid;
}
public function set datagrid(value:DataGrid):void
{
_datagrid = value;
}
public function get items():ArrayCollection
{
return _items;
}
public function set items(value:ArrayCollection):void
{
_items = value;
}
public function get params():Array
{
return _params;
}
public function set params(value:Array):void
{
_params = value;
}
public function get methodName():String
{
return _methodName;
}
public function set methodName(value:String):void
{
_methodName = value;
}
public function get allRecorders():int
{
return _allRecorders;
}
public function set allRecorders(value:int):void
{
_allRecorders = value;
}
public function get destination():String
{
return _destination;
}
public function set destination(value:String):void
{
_destination = value;
}
/**
*
*/
protected function progressBarClickHandler(event:MouseEvent):void
{
var bc:HBox = HBox(event.target);
widthTo = event.localX;
//progressBarEffect.target = progressBarPagerBlue;
//progressBarEffect.play();
}
/**
*
*/
private function getMinimum():int
{
if(allRecorders < 1)
{
return 0;
}
else
{
return 1;
}
}
/**
*
*/
protected function pageFirstClickHandler(event:MouseEvent):void
{
curpage = getMinimum();
getBtnEnabled();
pagingRemoteObject();
}
/**
* 上一页
*/
protected function pagePrevClickHandler(event:MouseEvent):void
{
var tempNum:int = getMinimum();
curpage = curpage - 1;
getBtnEnabled();
pagingRemoteObject();
}
/**
* 跳转到指定页
*/
protected function pageStepperClickHandler(event:MouseEvent):void
{
curpage = pageStepper.value;
}
/**
* 下一页
*/
protected function pageNextClickHandler(event:MouseEvent):void
{
if(curpage < totalPage)
{
curpage = curpage + 1;
}
getBtnEnabled();
pagingRemoteObject();
}
/**
* 最后一页
*/
protected function pageLastClickHandler(event:MouseEvent):void
{
curpage = totalPage;
getBtnEnabled();
pagingRemoteObject();
}
/**
* 刷新当前页
*/
protected function pageRefreshClickHandler(event:MouseEvent):void
{
totalPage = getTotalPageNum();
pagingRemoteObject();
}
/**
* 初始化函数
*/
protected function initHandler(event:FlexEvent):void
{
totalPage = getTotalPageNum();getBtnEnabled();
//pagingRemoteObject();
}
/**
* 设置每页显示多少条记录
*/
protected function pageSizeComboboxChangeHandler(event:IndexChangeEvent):void
{
var obj:Object = pageSizeCombobox.selectedItem;
pageSize = obj.pageSize;
trace(url,"",pageSize);
}
/**
* 求总页面数
* //计算总页面数-->总页数=(总记录数+每页显示的记录数-1)/每页显示的记录数
* */
private function getTotalPageNum():int
{
return (allRecorders + pageSize - 1) / pageSize;
}
/**
* 获取总页数
*/
private function getBtnEnabled():void
{
if(totalPage<=1)//所有按钮全灰掉
{
pageFirstBtn.enabled = false;
pagePrevBtn.enabled = false;
pageNextBtn.enabled = false;
pageLastBtn.enabled = false;
refrePageBtn.enabled = false;
}else if(curpage==1){ //当前在第一页
pageFirstBtn.enabled = false;
pagePrevBtn.enabled = false;
pageNextBtn.enabled = true;
pageLastBtn.enabled = true;
refrePageBtn.enabled = true;
}else if(curpage<totalPage && curpage > 1){ //当前在中间页数,不在第一页也不在最后一页
pageFirstBtn.enabled = true;
pagePrevBtn.enabled = true;
pageNextBtn.enabled = true;
pageLastBtn.enabled = true;
refrePageBtn.enabled = true;
}else if(curpage==totalPage){ //当前在最后一页
pageFirstBtn.enabled = true;
pagePrevBtn.enabled = true;
pageNextBtn.enabled = false;
pageLastBtn.enabled = false;
refrePageBtn.enabled = true;
}
/**如果有页数则刷新可用*/
if(totalPage > 0)
{
refrePageBtn.enabled = true;
}else{
refrePageBtn.enabled = false;
}
}
/**
* 服务请求成功的处理
*/
private function serviceSuccessResult(event:ResultEvent):void
{
var results:ArrayCollection = ArrayCollection(event.result.list);
trace(url,"请求成功,共"+_allRecorders+"条记录","每页显示",results,"\n当前页",curpage);
datagrid.dataProvider = results;
totalPage = getTotalPageNum();
pageStepper.value = http://www.mamicode.com/curpage;>
分页事件－－PagerEvent.as
package com.gwtjs.events
{
import flash.events.Event;
public class PagerEvent extends Event
{
private var _pager:Object;
public function set item(item:Object):void{
this._pager = item;
}
public function get item():Object{
return this._pager;
}
public function PagerEvent(type:String,obj:Object, bubbles:Boolean=false, cancelable:Boolean=false)
{
super(type, bubbles, cancelable);
this._pager = obj;
}
}
}
Test.mamx
<mx:Canvas xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
creationComplete="initHandler(event)" width="99%" height="780" xmlns:components="com.gwtjs.components.*">
<fx:Script>
<![CDATA[
import com.gwtjs.events.PagerEvent;
import com.gwtjs.renderer.grid.EnableItemIFactory;
import com.gwtjs.util.SimpleIndexUtil;
import com.gwtjs.window.UserAclEditorWindow;
import com.gwtjs.window.UserBugTypesEditorWindow;
import com.gwtjs.window.UserEditorWindow;
import com.gwtjs.window.UserParentUserEditorWindow;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.CloseEvent;
import mx.events.FlexEvent;
import mx.managers.PopUpManager;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
[Bindable]
private var currentItem:Object = new Object();
[Bindable]
private var userArray:ArrayCollection = new ArrayCollection([
{userId:"1000101",userAccount:"playCol",userName:"张111",parentUser:"",userMobile:"13902762078",status:"1",userAclTypeCode:"10",userAclTypeNames:"超级管理员",bugTypeNames:"蠕虫病毒",bugTypeCodes:"1",userDesc:"说明"},
{userId:"1000102",userAccount:"administrator",userName:"李芳",parentUser:"1000101",userMobile:"13902762078",status:"1",userAclTypeCode:"10",userAclTypeNames:"超级管理员",bugTypeNames:"木马植入",bugTypeCodes:"2",userDesc:"说明"},
{userId:"10001",userAccount:"admin888",userName:"陈真",parentUser:"",userMobile:"13902762078",status:"1",userAclTypeCode:"10",userAclTypeNames:"超级管理员",bugTypeNames:"SQL注入",bugTypeCodes:"3",userDesc:"说明"},
{userId:"10002",userAccount:"dzg867",userName:"王时",parentUser:"10001",userMobile:"13902762078",status:"1",userAclTypeCode:"20,30",userAclTypeNames:"安全管理员,检测人员",bugTypeNames:"木马植入",bugTypeCodes:"2",userDesc:"说明"},
{userId:"10003",userAccount:"you29386",userName:"杨二辉",parentUser:"10002",userMobile:"13902762078",status:"1",userAclTypeCode:"30,40",userAclTypeNames:"检测人员",bugTypeNames:"SQL注入",bugTypeCodes:"3",userDesc:"说明"},
{userId:"10004",userAccount:"zhang382",userName:"施文杰",parentUser:"10003",userMobile:"13902762078",status:"0",userAclTypeCode:"30",userAclTypeNames:"检测人员",bugTypeNames:"蠕虫病毒",bugTypeCodes:"1",userDesc:"说明"},
{userId:"10005",userAccount:"guangdong",userName:"晓科",parentUser:"10003",userMobile:"13902762078",status:"1",userAclTypeCode:"20,40",userAclTypeNames:"安全管理员,修复人员",bugTypeNames:"SQL注入",bugTypeCodes:"3",userDesc:"说明"}
]);
[Bindable]
[Embed("assets/images/user_edit.png")]
private var userEditorIcon:Class;
[Bindable]
[Embed("assets/images/user_add.png")]
private var userAddIcon:Class;
[Bindable] //叶子节点
[Embed(source="assets/images/user_delete.png")]
private var userDeleteIcon:Class;
[Bindable] //叶子节点
[Embed(source="assets/images/arrow_refresh_small.png")]
private var refreshBtnIcon:Class;
[Bindable] //定义渲染器 - 是否
private var enabledRender:IFactory = new EnableItemIFactory();
[Bindable]
private var indexRenderer:Class = SimpleIndexUtil;
import mx.formatters.DateFormatter;
public function compareTime(str:String):Boolean
{
var myPattern1:RegExp=/-|:| /g;
var dateFormatter:DateFormatter = new DateFormatter();
dateFormatter.formatString = "YYYY-MM-DD JJ:NN:SS";
var now:String= dateFormatter.format(new Date());
str = dateFormatter.format(str);
str = str.replace(myPattern1,'');
now = now.replace(myPattern1,'');
if(Number(str)>Number(now)){return true;}else{return false;}
}
public var time:String = "2014-11-29 18:33:22";
/**
* 初始化函数
*/
protected function initHandler(event:FlexEvent):void
{
var bool:Boolean = compareTime(time);
if(bool){
UserServicesController.getUsers(0,12);
}
}
/**
* 数据请求成功处理
* */
private function getUsersResultHandler(event:ResultEvent):void
{
var obj:Object = event.result;
trace(obj.list,obj.totalCount);
userArray = obj.list;
}
/**
* 请求异常
* 客户端的faultCode以Client开头，服务器端的faultCode以Server开头
* */
private function httpServiceFault(event:FaultEvent):void
{
var str:String = "客户端异常";
var index:int = -1;
var faultCode:String = event.fault.faultCode.toString();
index = faultCode.indexOf("Server", 0);
if(index!=-1)
{
str= "服务端异常";
}
//trace(index,str);
//客户端的faultCode以Client开头,服务器端的faultCode以Server开头
Alert.show(event.fault.toString(),faultCode);
trace(event.fault.toString());
}
/**添加用户*/
protected function userAddClickHandler(event:MouseEvent):void
{
var itemEditorWindow:UserEditorWindow = new UserEditorWindow();
//传值过去；
itemEditorWindow.title = "新增用户条目";
itemEditorWindow.action = "Insert";
itemEditorWindow.items = userArray;
itemEditorWindow.arrIndex = 0;
PopUpManager.addPopUp(itemEditorWindow,this,true);
PopUpManager.centerPopUp(itemEditorWindow);
}
/**
* 修改用户
* */
protected function userEditorClickHandler(event:MouseEvent):void
{
var index:int = userDataGrid.selectedIndex;
trace("103",index);
currentItem = userArray.getItemAt(index);
if(null==currentItem){
Alert.show("请选择编辑的条目","信息提示");
return;
}
var itemEditorWindow:UserEditorWindow = new UserEditorWindow();
//传值过去；
itemEditorWindow.title = "修改用户条目";
itemEditorWindow.action = "Update";
itemEditorWindow.items = userArray;
itemEditorWindow.item = currentItem;
itemEditorWindow.arrIndex = index;
PopUpManager.addPopUp(itemEditorWindow,this,true);
PopUpManager.centerPopUp(itemEditorWindow);
}
/**
* 删除用户
* */
protected function userRemoveClickHandler(event:MouseEvent):void
{
var item:Object = userDataGrid.selectedItem;
Alert.show("确定删除用户:"+item.userAccount+"密码 ?","信息提示",(1|2),this,function(event:CloseEvent):void{
if(event.detail == Alert.YES){
for(var i:int=0;i<userArray.length;i++){
if(item.userId==userArray[i].userId){
userArray.removeItemAt(i);
}
}
}
});
}
/**
* 删除用户
* */
protected function resetUserClickHandler(event:MouseEvent):void
{
var item:Object = userDataGrid.selectedItem;
Alert.show("确定重置用户:"+item.userAccount+"密码 ?","信息提示",(1|2),this,function(event:CloseEvent):void{
if(event.detail == Alert.YES){
Alert.show(item.userAccount+"密码重置成功!","信息提示");
}
});
}
[Bindable]
public var offset:int=0;
[Bindable]
public var pageSize:int=20;
/**
* 分页回调
* */
protected function serverPagingBarFunctionHandler(event:Event):void
{
trace("分页回调");
}
/**
* 在这里调用分页查询
* */
protected function userDataGridPagerEventHandler(event:PagerEvent):void
{
var obj:Object = event.item;
var bool:Boolean = compareTime(time);
if(bool){
UserServicesController.getUsers(obj.offset,obj.pageSize);
}
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
<s:RemoteObject id="UserServicesController" destination="UserServicesController" fault="httpServiceFault(event)"
endpoint="http://127.0.0.1:8080/buganalysis/messagebroker/amf">
<s:method name="getUsers" result="getUsersResultHandler(event)" />
</s:RemoteObject>
</fx:Declarations>
<mx:VBox width="100%" height="100%" verticalGap="0">
<mx:HBox width="100%" height="32" horizontalAlign="left" styleName="panelTitleBg"
verticalAlign="middle" horizontalGap="0">
<mx:LinkButton icon="@Embed(source='assets/images/icons/grid.png')" color="#FFFFFF" fontWeight="bold" label="用户管理" />
</mx:HBox>
<mx:VBox width="100%" height="100%" id="gridMainLayout" verticalGap="6" horizontalAlign="center" horizontalGap="6" paddingLeft="6" paddingRight="6" paddingBottom="6" paddingTop="6" >
<mx:HBox width="100%" height="36" verticalAlign="middle" borderColor="#696969" backgroundColor="#E6E0E0" cornerRadius="6" >
<mx:LinkButton label="新增用户" icon="{userAddIcon}" styleName="btnWeight" click="userAddClickHandler(event)" />
<mx:LinkButton label="修改用户" icon="{userEditorIcon}" styleName="btnWeight" click="userEditorClickHandler(event)" />
<mx:LinkButton label="删除用户" icon="{userDeleteIcon}" styleName="btnWeight" click="userRemoveClickHandler(event)" />
<mx:LinkButton label="重置密码" styleName="twoRrfreshBtn" click="resetUserClickHandler(event)" />
<mx:HBox width="100%" />
<mx:LinkButton label="刷新" icon="{refreshBtnIcon}" />
</mx:HBox>
<mx:DataGrid id="userDataGrid" headerStyleName="myHead" dataProvider="{userArray}"
rowCount="{userArray.length}" textAlign="center" width="100%" height="100%"
verticalGridLineColor="#CCCCCC" horizontalGridLines="true" horizontalGridLineColor="#CCCCCC">
<mx:columns>
<mx:DataGridColumn headerText="序号" itemRenderer="{new ClassFactory(indexRenderer)}" visible="false" />
<mx:DataGridColumn headerText="编号" dataField="userId" width="50" />
<mx:DataGridColumn headerText="登陆帐号" dataField="userAccount" textAlign="left" width="160" />
<mx:DataGridColumn headerText="用户姓名" dataField="userName" textAlign="left" width="160" />
<mx:DataGridColumn headerText="所属上级" dataField="parentUser" textAlign="left" width="160">
<!--
<mx:itemRenderer>
<fx:Component>
<mx:HBox textAlign="center" verticalAlign="middle" horizontalAlign="left">
<mx:LinkButton label="{data.parentUser}" width="88" click="outerDocument.parentUserBtnLickHandler(event)" />
<mx:LinkButton width="16" icon="@Embed(source='assets/images/icons/page_attach.png')" click="outerDocument.parentUserBtnLickHandler(event)" />
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
-->
</mx:DataGridColumn>
<mx:DataGridColumn headerText="手机号" dataField="userMobile" textAlign="left" width="160" />
<mx:DataGridColumn headerText="工号状态" dataField="status" textAlign="center" width="80" itemRenderer="{enabledRender}" />
<mx:DataGridColumn headerText="权限类别" dataField="userAclTypeNames" textAlign="left" width="180" visible="false">
<!--
<mx:itemRenderer>
<fx:Component>
<mx:HBox textAlign="center" verticalAlign="middle" horizontalAlign="left">
<mx:LinkButton label="{data.userAclTypeNames}" click="outerDocument.bugTypeBtnLickHandler(event)" />
<mx:LinkButton width="16" icon="@Embed(source='assets/images/icons/edit.gif')" click="outerDocument.bugTypeBtnLickHandler(event)" />
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
-->
</mx:DataGridColumn>
<mx:DataGridColumn headerText="操作权限" dataField="bugTypeNames" textAlign="left" width="180">
<!--
<mx:itemRenderer>
<fx:Component>
<mx:HBox textAlign="center" verticalAlign="middle" horizontalAlign="left">
<mx:LinkButton label="{data.bugTypeNames}" click="outerDocument.aclBtnLickHandler(event)" />
<mx:LinkButton width="16" icon="@Embed(source='assets/images/icons/set-ico.gif')" click="outerDocument.aclBtnLickHandler(event)" />
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
-->
</mx:DataGridColumn>
<mx:DataGridColumn headerText="用户说明" dataField="userDesc" textAlign="left" />
</mx:columns>
</mx:DataGrid>
<components:Pager id="serverPagingBar1" url="USER_DATAGRID" datagrid="{userDataGrid}"
myPagerEvent="userDataGridPagerEventHandler(event)"
myFunction="serverPagingBarFunctionHandler(event)" offset="{offset}" pageSize="{pageSize}"
destination="userFlexServices" methodName="getUsers" height="26" width="100%" />
</mx:VBox>
</mx:VBox>
</mx:Canvas>
处理流程：
1.调用分页组件
<components:Pager id="serverPagingBar1" url="USER_DATAGRID" datagrid="{userDataGrid}"
myPagerEvent="userDataGridPagerEventHandler(event)"
myFunction="serverPagingBarFunctionHandler(event)" offset="{offset}" pageSize="{pageSize}"
destination="userFlexServices" methodName="getUsers" height="26" width="100%" />
这里传入初始分页参数offset页偏移量，pageSize每页大小，myPagerEvent为分页处理事件，组件处理完分页参数后就分发事件，主页面可以执行此分页函数请求服务；
请求服务处理完成功后，再次将offset和pageSize传入Pager组件；
flex分页2 新新的，一页多次调用互相不冲突
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。