ExtJs Gridpanel實用技術

 行選擇模式:
Js代碼
var rowcount = grid.getSelectionNode().getSelections();
var rowcount = grid.getSelectionNode().getSelections();

可以獲取全部選中的記錄,得到的rowcount將是一個Array,比如想獲取sex列的數據,語句如下
Js代碼
var strsex = rowcount[i].get(‘sex’);
var strsex = rowcount[i].get(‘sex’);

單元格選擇模式
如果在GridPanel的配置屬性增加sm屬性如下
Js代碼
sm:new Ext.grid.CellSelectionModel();
sm:new Ext.grid.CellSelectionModel();

則表格的選擇模式爲單元格選擇模式。當單擊時將選中對應的某一個單元格,而不是默認的選擇某一行。選擇方式如下
Js代碼
var cell = grid.getSelectionNode().getSelectedCell();
var cell = grid.getSelectionNode().getSelectedCell();
得到的cell記錄了當前選擇的行(cell[0])以及列(cell[1]).可以通過一下語句得到該單元格數據

Js代碼
var colname = grid.getColumnModel().getDataIndex(cell[1]); //獲取列名
var celldata = grid.getStore().getAt(cell[0]).get(colname); //獲取數據

var colname = grid.getColumnModel().getDataIndex(cell[1]); //獲取列名
var celldata = grid.getStore().getAt(cell[0]).get(colname); //獲取數據
getStore():獲取表格的數據集
getAt():獲取該數據集cell[0]行
get():獲取該行colname的數據

2) 爲表格增加鏈接
有時我們需要爲表格中的某一列添加一個鏈接。可以利用renderer配置屬性爲該列添加html
如下:{id:'3',header:'名稱',dataIndex:'name',renderer:DomUrl},
定義DomUrl方法
Js代碼
function DomUrl(value){
return "<a href=>"+value+"</a>";
}

function DomUrl(value){
return "<a href=>"+value+"</a>";
}
如果表格內的數據是一個鏈接如:www.sina.com這樣寫法自然沒有問題,但是大多數時候我們在表格中不會直接寫一個鏈接,如果又需要根據單元格內容動態爲鏈接添加幾個參數。那這種寫法就幾乎沒有什麼用了。因爲這個屬性是在表格初始化的時候定義好的,而且表格初始化之後這個屬性無法改變,也就是隻讀屬性。

處理方法如下:
定義一個全局變量,初始值爲0;DomUrl函數如下
Js代碼
function DomUrl(value){
var row = grid.getSelectionModel().selectRow(startrow);//選中當前行
var rownum = grid.getSelectionModel().getSelected();//獲取當前行
startrow ++;
var strurl = "abc.jsp?id=" + rownum.get('id');//獲取當前選中行的值,並組織鏈接字符串
return "<a href='"+strurl+"'>"+value+"</a>";
}

function DomUrl(value){
var row = grid.getSelectionModel().selectRow(startrow);//選中當前行
var rownum = grid.getSelectionModel().getSelected();//獲取當前行
startrow ++;
var strurl = "abc.jsp?id=" + rownum.get('id');//獲取當前選中行的值,並組織鏈接字符串
return "<a href='"+strurl+"'>"+value+"</a>";
}
不過不要忘記在下次提交的時候將startrow賦值爲0。
3) 表格的屬性
表格的屬性分爲配置屬性(在操作表格時無法修改),以及其他可讀寫屬性,方法,以及事件。如下:
配置屬性
a) activeItem:渲染布局時激活的子元素。
b) applyTo:指定渲染對象。
c) autoDestroy:當容器的子元素從容器中移除時是否自動銷燬。
d) autoExpandColumn:指定自動填充表格剩餘區域的列id
e) autoExpandMax:可自動擴張的最大寬度。
f) autoExpandMin:可自動擴張的最小寬度
g) autoHeight:自動擴充高度
h) autoShow:是否自動顯示
i) autoWidth:自動擴充寬度
j) bbar/tbar:底部/頂部狀態欄
k) bufferResize:容器再佈局的緩衝頻率
l) colModel/cm:列模式
m) cls:組件的額外css格式。
n) collapsible:是否顯示快捷隱藏按鈕
o) defaults:指定默認配置。
p) disableSelection:是否禁止選擇表格行或列
q) enableDragDrop:是否允許表格列的拖放操作。
r) enableHdMenu:是否顯示錶格列的菜單。
s) frame:邊框是否顯示
t) loadMask: 是否顯示加載動畫
u) selModel/sm:表格選擇模式
v) store:表格數據集
w) stripeRows:是否顯示分隔線。
x) title:表格標題
方法
a) getColumnModel():得到表格列模型
b) getGridEl():得到表格下的元素
c) getPosition():得到組件的當前位置,返回一個數組
d) getSelectionModel():得到選中模型
e) getSize():得到組件大小
f) getStore():得到組件的數據集
g) getView():得到表格的GridView對象。
h) hide():隱藏當前組件
i) isVisible():判斷當前組件是否顯示
j) setDisabled( Boolean):設置組件的可用性
k) un():解除組件的監聽
l) on():爲組件添加監聽
on ( String eventName, Function handler, [Object scope] )
eventName:添加監聽的名稱
handler:事件處理函數
scope:事件響應的作用域,包括scope,delay,single,buffer。
http://www.lzgame.com/bbs/dispbbs.asp?boardid=5&Id=736

發佈了81 篇原創文章 · 獲贊 0 · 訪問量 18萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章