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
}
);


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM