In this blog, I’m explaining how to write the if-else statement in itemTpl configuration of list in sencha touch.
We have the list full of records and want to display such records which specify the given condition.
Example
Step-1:
First create a store to populate the list. In my store, there is two fields name and Boolean, the name field has different names and Boolean field have two values either true or false.
Ext.define('MyApp.store.MyStore', {
extend: 'Ext.data.Store',
config: {
data: [
{
name: 'Alex Stewart',
boolean: 'true'
},
{
name: 'Joseph Henry',
boolean: 'false'
},
{
name: 'Steve Smith',
boolean: 'true'
},
{
name: 'Paul Jones',
boolean: 'false'
},
{
name: 'Bill Skew',
boolean: 'true'
}
],
storeId: 'MyStore',
fields: [
{
name: 'name'
},
{
name: 'boolean'
}
]
}
});Step-2:
Next create a list and add the store to it. In the itemTpl configuration of list write the if-else statement as shown below:
Ext.define('MyApp.view.MyList', {
extend: 'Ext.dataview.List',
config: {
store: 'MyStore',
itemTpl: [
'<tpl if="boolean == \'true\'">',
' <p>{name}</p>',
' <tpl else>',
' <p>Boolean is false</p>',
'</tpl>'
]
}
});Output
Leave Comment