兰州军区68305部队照片:Extjs动态创建grid

来源：百度文库 编辑：偶看新闻 时间：2024/04/29 08:45:33
  1. Ext.onReady(function(){        
  2.   
  3.     var store;        //store   
  4.     var cm;           //columnModel   
  5.     var pagingBar;    //pagingBar   
  6.     var grid;         //grid   
  7.     var pageSize = 3; //pageSize   
  8.        
  9.     /*  
  10.      * 创建store  
  11.      */  
  12.     var createStore = function(record){   
  13.         var arrayField = record.name.split(',');   
  14.         var str = "{'fields':[";   
  15.         for(var i=0;i
  16.             str=str+"{name:'"+arrayField[i]+"',mapping:'"+arrayField[i]+"'},";   
  17.         }   
  18.         var fields = str.substring(0, str.length-1)+']}';   
  19.         var jsonFields = new Ext.util.JSON.decode(fields);   
  20.         store = new Ext.data.JsonStore({   
  21.             url:path+'/SysPage/getList.json',   
  22.             baseParams:{start:0},   
  23.             root:'rows',   
  24.             totalProperty:'rowCount',   
  25.             fields:jsonFields.fields,              
  26.             autoLoad:true  
  27.         });   
  28.         store.on('beforeload',function(){   
  29.             Ext.apply(store.baseParams,{   
  30.                 limit:pageSize   
  31.             });   
  32.                
  33.         });   
  34.         return store;   
  35.     };   
  36.     /*  
  37.      * 创建column  
  38.      */  
  39.     var createColumn = function(record){           
  40.         var arrayHead = record.fieldName.split(',');   
  41.         var arrayIndex= record.name.split(',');   
  42.         var columnArray = new Array();   
  43.         var rowNumber = new Ext.grid.RowNumberer();   
  44.         columnArray[arrayIndex.length]=rowNumber;   
  45.         var str = "{'columnModle':[new Ext.grid.RowNumberer(),";   
  46.         for(var i=0;i
  47.             str =str+"{'header':'"+arrayHead[i]+"',dataIndex:'"+arrayIndex[i]+"'},";   
  48.         }      
  49.         str = str.substring(0, str.length-1)+"]}";   
  50.         var jsonColumn = new Ext.util.JSON.decode(str);   
  51.         cm = new Ext.grid.ColumnModel(jsonColumn.columnModle);   
  52.         return cm;    
  53.     };   
  54.        
  55.     /*  
  56.      * 创建pagingToolbar  
  57.      */  
  58.     var createPage = function(store){   
  59.         pagingBar = new Ext.PagingToolbar({   
  60.             pageSize    : pageSize,   
  61.             store       : store,   
  62.             displayInfo : true  
  63.         });   
  64.         return pagingBar;   
  65.     };   
  66.   
  67.     /*  
  68.      * 创建grid  
  69.      */  
  70.     var createGrid = function(record){   
  71.         store = createStore(record);   
  72.         cm = createColumn(record);   
  73.         pagingBar = createPage(store);   
  74.         grid = new Ext.grid.GridPanel({            
  75.             cm:cm,   
  76.             store:store,   
  77.             tbar:[{   
  78.                 text:'查询',   
  79.                 handler:function(){   
  80.                     store.load({params:{start:0}});   
  81.                     grid.getView().refresh();   
  82.                 }   
  83.             },{   
  84.                 text:'查看',   
  85.                 handler:function(){   
  86.                     var record = grid.getSelectionModel().getSelected();   
  87.                     if(!record){   
  88.                         Ext.Msg.alert('tip','no data');   
  89.                     }else{   
  90.                         Ext.Msg.alert(record.get('name'),record.data.fieldName);   
  91.                     }   
  92.                 }   
  93.             }],   
  94.             height:500,   
  95.             bbar:pagingBar,   
  96.             listeners:{   
  97.                 'rowclick':function(grid,index,e){   
  98.                     var record = store.getAt(index).data;   
  99.                     Ext.Msg.alert(record.name,record.fieldName);   
  100.                 }   
  101.             }   
  102.   
  103.         });   
  104.         return grid;   
  105.     };   
  106.     /*  
  107.      * 创建viewport  
  108.      */  
  109.     var createViewport = function(record){   
  110.         grid = createGrid(record);   
  111.         return new Ext.Viewport({   
  112.             layout:'fit',   
  113.             items:[grid]   
  114.         });   
  115.     };   
  116.        
  117.     /*  
  118.      * 获取表字段  
  119.      */  
  120.     Ext.Ajax.request({   
  121.         url:path+"/SysPage/getById.json",   
  122.         params:{id:'6'},   
  123.         success:function(response,options){   
  124.             var array = Ext.util.JSON.decode(response.responseText);   
  125.             if(array!=null&&array.data!=null){   
  126.                 var record = array.data;//data是前台传递的JavaBean   
  127.                 createViewport(record);   
  128.             }   
  129.                
  130.         }   
  131.     });   
  132.        
  133.        
  134. }); 
如何创建动态链接库? pb动态创建数据表 急 创建C++动态链接库 我用DELPHI 开发程序报表控件使用Grid++3.0,怎么动态改变打印报表的标题 如何用vbScript创建动态变量名称 怎么动态创建NMSMTP发送邮件 在VB中如何动态创建控件？？ 在VB中如何动态创建控件？？ Datagrid如何动态创建列呀？ 如何用存储过程动态创建表 如何用存储过程动态创建表 (vc++)不用mfc,怎样动态创建控件？ 在vb中怎样动态创建窗口 state grid 是什么公司 使用Grid++的问题 使用Grid++的问题 grid 怎么与数据库连接 如何在DELPHI里动态创建一个access表 VB 里如何实现动态创建、删除ACCESS数据库 asp.net里面怎么操作动态创建的web控件 请问有谁知道VC下怎么实现动态创建表格？ 如何用vb动态创建htmlanchor控件并显示 如何在DELPHI中在本地动态创建DBF文件？ vc++net2003 中动态创建按钮不显示?