Changing the css dynamically for a span inside a div in a list itemTpl

[nayak.kavya]

Ext.define('Application.view.phone.AppScreen', {
extend: 'Ext.navigation.View',
// extend: 'Ext.Container',
xtype: 'appscreen',id: 'appscreen',
alias: 'widget.appscreen',
config:
{ items:
[{ xtype: 'container',
title: 'My View',
layout: { type: 'fit' },
items:[{
html:'phone'
},
{ xtype:'list',
id:'AccountSummary',
name:'AccountSummary',
onItemDisclosure:true,
store:{ fields: ['Label', 'Amount'],
data: [
{
"Label":"Order", "Amount": "18,275" },
{
"Label":"Shipment", "Amount": "25,255"
},
{
"Label":"Invoices", "Amount": "11,125"
}
] },
itemTpl: new Ext.XTemplate('{Label}<tpl if="Label==Order"><div class="meter"><span style="width: 60%"></span></div></tpl><tpl if="Label==Shipment"><div class="meter1"><span style="width: 60%"></span></div></tpl><br>$ {Amount} Cash')

I need to change the css dynamically for example if the label is order I need to apply the css meter,similarly meter1 for Shipment.There is a mistake in the itemTpl.Can someone please help me on this?

[jerome76]

Try

<tpl if="values.Label==\'Order\'">

and

<tpl if="values.Label==\'Shipment\'">

[nayak.kavya]

Hey thanks a lot it worked.

[jerome76]

Great Just remember to mark it as answered if it fully solved the issue