有人能举例说明如何在Extjs中使用XTemplate来包含特定的css类吗? tpl if="total 5000" yellow csstpl else red css/tpl 编辑: 我有类似的东西 new Ext.XTemplate('span style="display:inline-block; margin-right: 730px;
<tpl if="total > 5000">
yellow css
<tpl else>
red css
</tpl>
编辑:
我有类似的东西
new Ext.XTemplate('<span style="display:inline-block; margin-right: 730px;"">' + title + ' ({count}) </span>',
'<span ',
'<tpl if="priceTotal > 5000"> style="color:black;" class="x-form-item-label x-form-warning"</tpl>',
'> {priceTotalLabel}: {priceTotal}',
'</span>'
);
我想用变量中的值替换值5000,所以它不是硬编码的,我该怎么做?
例如:var data = {
name: 'Don Griffin',
kids: [
{ name: 'Aubrey', age: 17 },
{ name: 'Joshua', age: 13 },
{ name: 'Cale', age: 10 },
{ name: 'Nikol', age: 5 },
{ name: 'Solomon', age: 0 }
]
},
tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Kids: ',
'<tpl for="kids">',
' <p',
'<tpl if="age > 1"> class="red"</tpl>',
'>{name}</p>',
'</tpl></p>');
tpl.overwrite(Ext.getBody(), data);
http://jsfiddle.net/L2dSX/
或者你可以使用一个功能:
tpl = new Ext.XTemplate(
'<p>Name: {name}</p>',
'<p>Kids: ',
'<tpl for="kids">',
' <p class="{[this.getKidClass(values)]}">{name}</p>',
'</tpl></p>',
{
getKidClass: function(kid){
debugger;
return kid.age > 1 ? 'red' : '';
}
}
);
http://jsfiddle.net/Cu85J/
