extjs學習筆記（轉）

javascript 定義數組 ：
var   myArray   =   new   Array(1,2,3,4,)   //普通方式   
var   myArray   =   new   Array(20)   //20個元素   
var   myArray   =   [1,2,3,4,5,6]   //數組直接量

Ext.getDom("wentao")等價於Ext.get("wentao").dom

得到瀏覽器的寬高：
Ext.lib.Dom.getViewWidth();
Ext.lib.Dom.getViewHeight();

得到某個Element的寬高：
<div id="ux-taskbar">
 ....
</div>
Ext.get('ux-taskbar').getWidth();
Ext.get('ux-taskbar').getHeight();

為某個Element增加一個樣式：
Ext.get('ux-taskbar').addClass("樣式名稱");
為某個Element移除一個樣式：
Ext.get('ux-taskbar').removeClass("樣式名稱");


設置桌面背景顏色 ：
Ext.get(document.body).setStyle('background-color', '#972929');
更新樣式表中某項的某個屬性 :
Ext.util.CSS.updateRule('.ux-shortcut-btn-text', 'color', '#'+hex);

更改Ext窗體樣式方案 ：
Ext.util.CSS.swapStyleSheet('theme', “/ext/theme/vistablue/css/vistablue.css”);

截取字符串：
Ext.util.Format.ellipsis(data.name, 17);

在頁面上打印信息 ： 
var bd = Ext.getBody();
bd.createChild({tag: 'h2', html: '朱元璋'});

當前日期再加 -21天后的日期：
new Date().add('d', -21)

打印一個東西的類型 ：
            var _s = Ext.query("#center-ul li");
            for (i = 0; i < _s.length; i++) {
                alert(typeof _s[i])
            }




注冊一個事件 ： 

    Person  =  function()  {
        this.addEvents("click1");//注冊click事件
    }

注冊多個事件 ：

    Wt.Person  =  function()  {
        this.addEvents("namechange", "sexchange");
    } ;

注冊的事件有屬性(json格式)：

     this .addEvents( {
        'ready' : true,
        'beforeunload' : true
    } );

上面代碼執行完后，必須跟上 ：

Ext.extend(Person, Ext.util.Observable);

一 ： Ext.Ajax.request

Ext.Ajax.request( {
    url: 'http://localhost:81/_ajax/jsp/ajax1.jsp',
    success: function(response) {
        Ext.Msg.alert('成功', response.responseText);
    },
    failure: function(response) {
        Ext.Msg.alert('失敗', response.responseText);
    },
    params: { name: 'value' }
} );

params參數表示請求時發送到后台的參數，既可以使用JSON對象，也可以直接使用"name=value"形式的字符串。


Ext.Ajax直接繼承自Ext.data.Connection，不同的是，它是一個單例，不需要用new創建實例，
可以直接使用Ext.data.Connection。在使用Ext.data.Connection前需要先創建實例，因為Ext.data. Connection是為了給Ext.data中的各種proxy提供Ajax功能，分配不同的實例更有利於分別管理。
Ext.Ajax為用戶提供了一個簡易的調用接口，實際使用時，可以根據自己的需要進行選擇。

二 ：代理相關的類 ： 

1： Ext.data.DataProxy

數據代理類是一個純虛類，主要用於生成Ext.data.Record對象，沒有公開的屬性和方法，只是歸定子類需要處理三個事件

1 beforeload : ( Object This, Object params )
2
3 load : ( Object This, Object o, Object arg )
4
5 loadexception : ( Object This, Object o, Object arg, Object e )

事實上參數也是子類自定義的

2： Ext.data.HttpProxy
和下面的Ext.data.MemoryProxy還有Ext.data.ScriptTagProxy都繼承於DataProxy ，HttpProxy用於遠程代理,而且服務端返回信息時必須指定Content-Type屬性為"text/xml".

2.1： HttpProxy( Object conn )
構造一個HttpProxy對象,參數可以是一個類似於{url: 'foo.php'}這樣的json對象,也可以是一個Ext.data.Connection對象,如果參數沒有指定，將使用Ext.Ajax對象將被用於發起請求

2.2： getConnection() : Connection
得到當前連接對象

2.3： load( Object params, Ext.data.DataReader reader, Function callback, Object scope, Object arg ) : void
從配置的connection對象得到record數據塊，並激發callback

params:        發起http請求時所要傳遞到服務端的參數
DataReader:    見DataReader
callback:    回叫方法,第一個參數為接收到的信息,第二個參數為arg,第三個是成功標志
scope:        范圍
arg:        這兒的參數將會傳遞給回叫函數callback

使用示例:

var proxy = new  Ext.data.HttpProxy( {url:'datasource.xml'} );
var reader  =   new  Ext.data.XmlReader( {
      totalRecords: "results",
      record: "row",        
      id: "id"                
    } , [
       {name: 'name', mapping: 'name'} ,
       {name: 'occupation'}           
    ]);
  
// 定義回叫方法
var metadata;
function callback(data,arg,success) {
   if(success){
      metadata=data;
   }
}

proxy.load(  null ,reader,callback, this );

3：Ext.data.MemoryProxy

3.1: MemoryProxy( Object data )
構造

3.2: load( Object params, Ext.data.DataReader reader, Function callback, Object scope, Object arg ) : void
取數據，和HttpProxy類似,只是params參數沒有被使用

使用示例

var proxy = new  Ext.data.MemoryProxy([ [ 1 ,  ' Bill ' ,  ' Gardener ' ], [ 2 ,  ' Ben ' ,  ' Horticulturalist ' ] ]);
var reader  =   new  Ext.data.ArrayReader(
     {id: 0} ,
    [
     {name: 'name', mapping: 1} ,        
     {name: 'occupation', mapping: 2}   
]);

var metadata;
function callback(data,arg,success) {
    metadata=data;
}

proxy.load(  null ,reader,callback, this );

4:  Ext.data.ScriptTagProxy

這個類和HttpProxy類似，也是用於請求遠程數據,但能用於跨主域調用,如果請求時使用了callback參數
則服務端應指定Content-Type屬性為"text/javascript"
並返回callback(jsonobject)
反之則應置Content-Type屬性為"application/x-json"
並直接返回json對象

4.1 : ScriptTagProxy( Object config )
構造,其中
config定義為{
callbackParam : String,    //回叫參數
nocache : Boolean,    //是否緩存
timeout : Number,    //超時
url : String        //請求數據的url
}

4.2: abort() : void
放棄

4.3: load( Object params, Ext.data.DataReader reader, Function callback, Object scope, Object arg ) : void

三 ：Ext.data.JsonStore使用HttpProxy加載數據時傳遞參數的兩種方法

1.用baseParams屬性

var Type1Store  =   new  Ext.data.JsonStore( {
    fields: ['name','id'],
    url: 'LoadData.aspx',
    baseParams: {mode: 'type1'},
    autoLoad: true
} );

 

2.在Store load的時候傳遞

var Type1Store  =   new  Ext.data.JsonStore( {
    fields: ['name','id'],
    url: 'LoadData.aspx',
    baseParams: {mode: 'type1'},
    autoLoad: true
} );