我使用 extjs4
我有一个网格，我想在网格中添加与条件相关的图标
我有一个CSS类
但是图标显示多次的问题
我的代码CSS：
.contactIcon80 {
background-image: url(/UrbanPlanning/theme/images/delete.png);
width:80px!important;
height:80px!important;
margin-right: auto !important;
margin-left: auto !important;
}
我的代码 extjs：
函数 showUpdated（值、元数据、记录、行索引、列索引、存储）{
if(record.get("statut_reqUPReliance")=="WaitingAccept") {
metaData.css = ' contactIcon80';
}
return value;
}
var RequestUPRelianceListGrid1 = Ext.create('Ext.grid.Panel', {
id:'RequestUPRelianceListGrid1',
store: RequestUPRelianceListGridStore,
collapsible:true,
title:'title',
columns: [
{xtype: 'checkcolumn', header: 'test',dataIndex: 'checked', width: 60,listeners:{'checkchange': RequestUPRelianceGridSelectionChanged}},
{text: 'numero', flex: 1, sortable: true, hidden:true, dataIndex: 'num_reqUPReliance'},
{text: 'statut', flex: 1, sortable: true, dataIndex: 'statut_reqUPReliance', renderer: showUpdated}
],
columnLines: true,
anchor: '100%',
frame: true,
height: 250,
margin: '5 5 5 5',
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
ui: 'footer',
layout: {
pack: 'center'
},
items: [
{
xtype: 'button',
text: 'new',
id:'new_R',
handler: function() {
}
}
]
}]
});
现在我尝试使用此代码：
.contactIcon80{
background-image: url("/UrbanPlanning/theme/images/delete.png") !important;
background-position:center !important;
width: auto !important;
background-repeat: no-repeat;
}
它可以正常工作
现在我想添加工具提示的概念
我尝试修改我的代码：
function showUpdated(value, metaData, record, rowIndex, colIndex, store) {
if(record.get("statut_reqUPReliance")=="WaitingAccept") {
metaData.css = ' contactIcon80';
}
return value;
}
var RequestUPRelianceListGrid1 = Ext.create('Ext.grid.Panel', {
id:'RequestUPRelianceListGrid1',
store: RequestUPRelianceListGridStore,
collapsible:true,
title:'title',
columns: [
{xtype: 'checkcolumn', header: 'test',dataIndex: 'checked', width: 60,listeners:{'checkchange': RequestUPRelianceGridSelectionChanged}},
{text: 'numero', flex: 1, sortable: true, hidden:true, dataIndex: 'num_reqUPReliance'},
{text: 'statut', flex: 1, sortable: true, dataIndex: 'statut_reqUPReliance',tooltip: 'currentStatus',renderer: showUpdated}
],
columnLines: true,
anchor: '100%',
frame: true,
height: 250,
margin: '5 5 5 5',
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
ui: 'footer',
layout: {
pack: 'center'
},
items: [
{
xtype: 'button',
text: 'new',
id:'new_R',
handler: function() {
}
}
]
}]
});
我的目标是当我将光标移动到我希望显示此消息“当前状态：...”的图标时，
statut 将根据statut_reqUPReliance的值显示
所以我认为我应该添加工具提示的测试
if(record.get("statut_reqUPReliance")=="WaitingAccept") {
metaData.css = ' contactIcon80';
// here I should disply the message of tooltip which is "WaitingAccept"
}