DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> EXT中單擊button按鈕grid添加一行(光標位置可設置)的實例代碼
EXT中單擊button按鈕grid添加一行(光標位置可設置)的實例代碼
編輯:關於JavaScript     

先給大家說下什麼是ext

ext是一個強大的js類庫,以前是基於YAHOO-UI,現在已經完全獨立了, 主要包括data,widget,form,grid,dd,menu,其中最強大的應該算grid了,編程思想是基於面向對象編程(oop),擴展性相當的好.可以自己寫擴展.自己定義命名空間.web應用可能感覺太大.不過您可以根據需要按需加載您想要的類庫就可以了.  

主要包括三個大的文件ext-all.css,ext-base.js,ext-all.js(包括所有的類庫,您可以根據需要進行刪減.官方網站提供這一接口),在引用ext類庫的時候.這三個文件必不可少. 

它提供了豐富的,非常漂亮的外觀體驗,成為眾多界面層開發人員的追捧!其核心的組件基本覆蓋了我們構建富客戶端的常用的組件。  

從 Ext 2開始,商業版(針對那些以盈利為目的的開發方)要收費了。
這可能會影響一些他的應用前景。   目前的最新版本為3.2.2

1.創建一個添加按鈕,listeners事件中button的單擊事件,

{
id:'button1',
xtype : 'button',
margin : '6',
text : '添加',
name : 'btn-add',
iconCls: 'btn-add',
listeners:{
click:function(){
var r = Ext.create('ItemGridMdl', {           //…………
});//要插入表格的數據
Ext.getCmp('grid1').getStore().insert(Ext.getCmp('grid1').getStore().getCount(), r);//在表格的最後添加一行
cellEditing.cancelEdit();
cellEditing.startEditByPosition({//要編輯的表格中的光標出現的位置
row : Ext.getCmp('grid1').getStore().getCount()-1,
column : 1
});
} 
}
}

2.調用這個button按鈕的方法

Ext.getCmp('fbutton').fireEvent('click');

3.grid表格中plugins:屬性的配置:

plugins:[
cellEditing=Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit:1,
listeners: {
edit: function(editor,e) {
}
}
})
],
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved