Select rows Ext.dataview.List based on Store - extjs

Question

Ext.create('Ext.data.Store', {
fields: ['id', 'name'],
storeId: 'modules',
data : [
{"id":"0", "active": "1", "label": "RST", "name":"строка 1"},
{"id":"1", "active": "0", "label": "KAS", "name":"строка 2"},
{"id":"2", "active": "1", "label": "UKR", "name":"строка 3"},
{"id":"3", "active": "0", "label": "KJV", "name":"строка 4"},
]
});
in items:
{
xtype: 'list',
store: 'modules',
mode: 'MULTI',
queryMode: 'local',
fullscreen: true,
margin: '10 10 10 10',
itemTpl: '<div class="contact">{id} <b>{label}</b> {name}</div>'
}
how to select specific rows in a 'List' based on asset index 'active' in Store ?
when loading, the first and third lines should be highlighted (selected)
Can this be done based on XTemplate ?

Answer 1

XTemplate is used for custom display of a row in your list. For the selection you need to use setSelection method on the list in a loop that gets all records with active=="1". Check the following code, also there is a fiddle here showing it in work:
Ext.application({
name: 'Fiddle',
launch: function () {
let store = Ext.create('Ext.data.Store', {
fields: ['id', 'name', 'active', 'label'],
data: [{
"id": "0",
"active": "1",
"label": "RST",
"name": "строка 1"
}, {
"id": "1",
"active": "0",
"label": "KAS",
"name": "строка 2"
}, {
"id": "2",
"active": "1",
"label": "UKR",
"name": "строка 3"
}, {
"id": "3",
"active": "0",
"label": "KJV",
"name": "строка 4"
}, ]
});
let list = Ext.create({
xtype: 'list',
store: store,
mode: 'MULTI',
queryMode: 'local',
fullscreen: true,
margin: '10 10 10 10',
itemTpl: '<div class="contact">{id} <b>{label}</b> {name}</div>',
renderTo: Ext.getBody(),
});
store.each(function (record, id) {
if (record.get('active') == "1") {
list.setSelection(record);
}
});
}
});