EXTJS網格行着色失敗

我使用的是extjs 3.2。我只參考http://skirtlesden.com/articles/styling-extjs-grid-cells嘗試過一個網格行着色示例。在gridExample.js文件中添加網格視圖配置，該文件持有靜態網格。EXTJS網格行着色失敗

viewConfig: { 
    stripeRows: false, 
    getRowClass: function(record) { 
     return record.get('age') < 18 ? 'child-row' : 'adult-row'; 
    }

並在html頁面中添加了CSS。

HTML代碼，

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
pageEncoding="ISO-8859-1"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>success</title> 
<link href="/testing/ext/resources/css/ext-all.css" rel="stylesheet" type="text/css" /> 
<link href="/testing/ext/resources/css/test.css" rel="stylesheet" type="text/css" /> 
<style> 
.child-row .x-grid-cell { 
    background-color: #ffe2e2; 
    color: #900; 
} 
.adult-row .x-grid-cell { 
    background-color: #e2ffe2; 
    color: #090; 
} 
</style> 
<script src="/testing/ext/adapter/ext/ext-base.js"></script> 
<script src="/testing/ext/ext-all.js"></script> 
<script src="/testing/JS/gridExample.js"></script> 
</head> 
<body> 
</body> 
</html>

但網格行的顏色沒有改變。大多數論壇都確定代碼。那麼，在html頁面中使用css會有什麼問題嗎？提前致謝。

來源

2013-07-23 Muthuramu Periyaiah

分機3.x的使用形式x-grid3-...的CSS類網格元件。您可以檢查this 3.2 example的標記以供自己查看。

所以，你的CSS應該是：

.child-row .x-grid3-cell { 
    background-color: #ffe2e2; 
    color: #900; 
}

來源

2013-07-24 22:49:30 rixo

非常感謝你rixo。 –

我不得不將!important添加到這些屬性以獲得與工作類似的東西。

.child-row .x-grid-cell { 
    background-color: #ffe2e2 !important; 
    color: #900 !important; 
}

來源

2013-07-23 11:17:58 kevhender

感謝您的答覆kevhender。沒有工作。我自己嘗試過。「！重要」它說; 「這很重要，忽略後續的規則，以及任何常見的特殊性問題，都適用這個規則！」 –

您是否肯定該課程正在應用於該行？你有沒有通過檢查證實這一點？ – kevhender

是的，我是積極的。我使用調試器，並將類分配給每一行。但沒有顏色變化:( 是否有可能與Extjs 3.2版本的問題？coz http://skirtlesden.com/articles/styling-extjs-grid-cells被提及extjs 4 –

EXTJS網格行着色失敗

回答

相關問題