Hi,
I am trying to set up a virtual list using the code below
var virtualList = app.virtualList.create({
// List Element
el: '.virtual-list',
// Pass array with items
items: data,
renderItem:function(item){
return console.log('test')
},
// Custom search function for searchbar
searchAll: function (query, items) {
var found = [];
for (var i = 0; i < items.length; i++) {
if (items[i].NAME.toLowerCase().indexOf(query.toLowerCase()) >= 0 || query.trim() === '') found.push(i);
}
return found; //return array with mathced indexes
},
// List item Template7 template
itemTemplate:
'<li>' +
'<a href="#" class="item-link item-content">' +
'<div class="item-inner">' +
'<div class="item-title-row">' +
'<div class="item-title">{{NAME}}</div>' +
'</div>' +
'<div class="item-subtitle">stuff</div>' +
'</div>' +
'</a>' +
'</li>',
// Item height
height: app.theme === 'ios' ? 63 : (app.theme === 'md' ? 73 : 46),
})
Now this works, as it displays out the list items however I need to run some code before its actually inserted where we do some string concatenations and other custom functions to get the correct data for each item.
Reading the docs it would appear that I could use renderItem, however this does not appear to fire if itemTemplate is in place however removing the itemTemplate
var virtualList = app.virtualList.create({
// List Element
el: '.virtual-list',
// Pass array with items
items: data,
renderItem:function(item){
return console.log('test')
},
// Custom search function for searchbar
searchAll: function (query, items) {
var found = [];
for (var i = 0; i < items.length; i++) {
if (items[i].NAME.toLowerCase().indexOf(query.toLowerCase()) >= 0 || query.trim() === '') found.push(i);
}
return found; //return array with mathced indexes
},
// Item height
height: app.theme === 'ios' ? 63 : (app.theme === 'md' ? 73 : 46),
})
and just having renderItem only seems to work on the first iteration, then throwing an error message
Uncaught TypeError: Cannot read property 'trim' of undefined -From line 13 of https://localhost:8000/src/framework7/js/framework7.bundle.min.js
Not sure what I’m doing wrong here…