flex的获取远程服务器端返回数据并在页面展示

1.在flex里面显示查询后的list集合数据

//全局配置类

 private var model:ModelConfig=ModelConfig.getOne();

 ModelCong类中存放一些全局的东西要实现接口implements IModelLocator

(如public var root:String=" http://192.168.1.68:8090/OA ";--系统数据,

public var users:UsersVO=new UsersVO();用来存储信息的变量,

public var tiaomaLogTing:ArrayCollection=new ArrayCollection();//List集合用来存放类似与users的JAVABEAN实体对象)

ModelConfig.as

---------------------------------------------

package fx.model
{
    import com.adobe.cairngorm.model.IModelLocator;
   
    import fx.util.PageBar;
    import fx.util.Pages;
   
    import mx.collections.ArrayCollection;
   
    import spark.components.TitleWindow;
    import spark.components.WindowedApplication;
   
   
    [Bindable]
    /**
     *配置所有需要的model类
     * @author Administrator
     *
     */
    public class ModelConfig implements IModelLocator
    {
        //系统数据
        public var root:String="http://localhost:8090/flexserver";
        public const ISDEPLOY:Boolean=true;
        public var states:String="loginState";
        public var message:String="";

        //远端服务器地址
        public var root:String="http://10.1.0.155:8081/test";
       
        //公用
        public var rootWin:WindowedApplication;
        public var loginViewWin:TitleWindow;
        public var mainViewWin:TitleWindow;
        public var doEvaluateVO:DoEvaluateVO;
      
           /////////////////////////////////////////////////////////////////         
          private static var one:ModelConfig;
         public static function getOne():ModelConfig
          {
               if (one == null)one = new ModelConfig();
               return one;
          }
          public function ModelConfig()
          {
               //if (one !=null )throw new Error( "Only one should be instantiated" );
              
          }
         
    }
}

 

 

 


页面上的数据展示:

因为ModelConfig声明称Bindable ,所以才能在mxml上使用{ model.tiaomaLogTing }来进行数据绑定

<mx:DataGrid dataProvider=" { model.tiaomaLogTing } " id=" tiaomaList " >

<mx:columns>     

   <mx:DataGridColumn headerText=" daima " dataField=" daima " />//daima是JAVABEAN实体类里面的属性

<mx:DataGridColumn headerText=" chongfu " dataField=" chongfu " />

<mx:DataGridColumn headerText=" jieshu " dataField=" jieshu " />

<mx:DataGridColumn headerText=" shuliang " dataField=" shuliang " />

<mx:DataGridColumn headerText=" xftm " dataField=" xftm " />

</mx:columns>

</mx:DataGrid>

 

2.与后台交互

  flex前台要有一个和后台对应的VO用来存储信息

2.1查询query();

  creationComplete="query();"//页面加载事件

  public function query():void{
      var name:String=this.ename.text;
      var title:String=this.title.text;
      var content:String=this.content.text;  
      var para:Object={tname:name,
              ttitle:title,
              tcontent:content,
              tsid:sid,
              loginname:loginname,
              type:'init'};

            //调用自己编写的CD类

      CairngormUtil.event("TopicListCD ",para);//与后台交互的CD

   }

 

   在自己编写的前端控制器类中进行注册:

   TopicListCD要在public class CommandConfig extends FrontController中进行注入

   add(fx.commands.intalk.TopicListCD);


   TopListCD类的代码如下:

  public class TopicListCD extends BaseCommand
 {
  private var ty:String;

  // 发送请求到远程服务器端 的方法
  override public function execute(event:CairngormEvent):void{
   var data:Object=event.data;
   data['method']="doSearch";//后台的查询方法
   ty=data.type;
   var
";// url:String=model.root+"/intalkAction.do 后台对应的Action
   CairngormUtil.send(url,this,data);//发送请求到远程服务器端
  }
  //远程服务器端返回结果处理方法
  override public function result(data:Object):void{
   var xml:XML=XML(data.result);//得到结果
   var topicList:Array=LukaTool.xmlbean(xml.TopicVO,"fx.model.TopicVO"); //后台得到的List集合JAVABEN
   model.topicList=new ArrayCollection(topicList);  //放入flex页面要显示的list集合里面
   if(ty=='init' && ty!=""){
    model.topicPage=new Pages(xml.count);//分页对象
   }else{
    var tem:int=model.topicPage.currentPage;
    model.topicPage=new Pages(xml.count);    
    model.topicPage.currentPage=tem;
   }
   model.topic=new TopicVO();
  }  
 }

 

分页类:

 

package fx.util
{
 import mx.controls.Alert;
 
 [Bindable]
 public class Pages
 {
      public var totalrows:int;//总行数
      public var currentPage:int;// 当前页数
     
      public var pageSize:int=10;//每页显示行数
      public var totalPages:int;//总页数
      public var startRow:int;//当前页在数据库中的起始行
    
  
      public var currentIndex:int=-1;//当前处理序列
      public function Pages(_totalrows:int){       
       if(_totalrows>0){
       this.totalrows=_totalrows;
       totalPages=totalrows/pageSize;
       var mod:int=totalrows%pageSize;
       if(mod>0){
       totalPages++;
       }
        currentPage=1;//默认显示第一页
        startRow=(currentPage-1)*pageSize;
    
       } 
      }
  
   //第一页
    public function first():void{
     currentPage=1;
     startRow=0;
    }
    //下一页
    public function next():void{
    if (currentPage < totalPages) {
        currentPage++;
    
      }
      startRow = (currentPage - 1) * pageSize;

     }
     //上一页
      public function previous():void { 
      if (currentPage == 1) {
        return;
      }
      if(currentPage>0)
      currentPage--;
   
      startRow = (currentPage - 1) * pageSize;
    }
    //尾页
      public function last():void { 
      currentPage = totalPages;
      startRow = (currentPage - 1) * pageSize;
    }
     //跳转第几页
      public function refresh(_currentPage:int) :void{
      currentPage = _currentPage;
      startRow = (currentPage - 1) * pageSize;
      if (currentPage > totalPages) {
        last();
      }
    }
    
 }
}

 

转自:http://blog.csdn.net/litinghema0725/archive/2010/01/14/5190861.aspx

你可能感兴趣的:(flex的获取远程服务器端返回数据并在页面展示)