第一種情況:載入資料時改變列的顏色
首先定義乙個樣式如下(這裡以紅色背景為例):
.x-grid-back-red
定義改變顏色的列:
}效果圖如下:
第二種情況:載入資料完成後改變行的顏色
首先要解決的乙個問題是如果判斷資料已經載入完畢,最簡單的方法是給grid的store新增onload事件。
如果你想有條件地改變某行的背景顏色,則還需要遍歷gird的store,這裡有個簡單的方法即store的
each方法。看下面這個例子:
grid.getstore().on('load',function(s,records)else if(r.get('zy')=='本年累計')else if(r.get('zy')=='期初餘額')
girdcount=girdcount+1;
});});
效果圖如下:
第三種情況:使用ext本身的顏色渲染效果
暫時只發現ext已經設計好的一種效果:單雙行背景顏色不同。
很簡單,在grid中配置striperows為true即可!
另外,如果想使用自己定義的行的背景顏色,那就去修改ext-all.css吧,提供幾個:
-----------在ext-all.css修改**如下---------
.x-grid3-row
.x-grid3-row-alt
.x-grid3-row-over
//修改grid某一行樣式 grid.getview().addrowclass(r,css)
//修改grid某一單元格樣式 ext.get(grid.getview().getcell(r,c)).addclass(css) 或 grid.getview().getrow(r).style.backgroundcolor="red"; //css樣式為自定義樣式
Extjs grid 合併單元格
這個方法四個引數分別是 row 合併起始行 col 合併起始列.這兩個引數是為了定位,要從哪個單元格開始合併.type 是要合併行或者列.num 是要合併的數量 監聽load 執行合併單元格 grid.getstore on load function var span function grid,...
Extjs Grid合併單元格
客戶需求需要將grid 中的資料進行合併單元格處理!公司程式用的是extjs3.x 的 底層生成的html 不是標準的table 所以合併單元格只能另闢蹊徑!以下是在網上找的extjs3 和 extjs4 的合併單元方法!解決extjs4.1合併單元格問題 param grid 要合併單元格的gri...
Extjs grid 單元格編輯
實現grid勾選後出現編輯按鈕,通過增加乙個欄位checked來控制 事件如下 selectionchange function thi,selected,eopts deselect function row,record,index,eopts grid中如下 else listeners va...