Remove From My Forums

Limit the Items shown by listView?

Question
0

Sign in to vote

Hi,

is there any means of setting a listview to only show x number of items per group?

I have a datasource that returns an unknown number of items per group but I would like to limit the listview to only display a certain number to stop it from becoming too large.

Thanks,

Felix

Thursday, June 7, 2012 1:30 PM

Answers

If there is I haven't seen one. Normally you'd have whatever returns your data limit the resultset to save memory and transport cost.

Anyway, I wrote a little sample code that you can tweak to prefilter your WinJS.Binding.List to the appropriate number of items in the group (by grabbing the first N items in each group).

item.group is really just a way to get a key for the group the item is in, you can replace that with whatever groupKey function you pass to list.createGrouped();

var data = [
    { group: "first", value: 1 },
    { group: "second", value: 2 },
    { group: "third", value: 3 },
    { group: "first", value: 1 },
    { group: "second", value: 2 },
    { group: "first", value: 1 },
    { group: "second", value: 2 },
    { group: "third", value: 3 },
    { group: "first", value: 1 },
    { group: "second", value: 2 },
    { group: "third", value: 3 },
    { group: "forth", value: 4 },
    { group: "fifth", value: 5 },
    { group: "first", value: 1 },
    { group: "second", value: 2 },
    { group: "third", value: 3 },
    { group: "forth", value: 4 },
    { group: "fifth", value: 5 },
    { group: "forth", value: 4 },
    { group: "fifth", value: 5 },
    { group: "first", value: 1 },
    { group: "second", value: 2 },
    { group: "third", value: 3 },
    { group: "forth", value: 4 },
    { group: "fifth", value: 5 },
    { group: "fifth", value: 5 },
    { group: "forth", value: 4 },
    { group: "fifth", value: 5 },
    { group: "first", value: 1 },
];

var list = new WinJS.Binding.List(data);

var groupCount = {};
var maxItems = 3;

var filteredList = list.createFiltered(function _filterItems(item) {
    groupCount[item.group] = groupCount[item.group] ? groupCount[item.group] + 1 : 1;
    return groupCount[item.group] <= maxItems;
});

Proposed as answer by Bryan Thomas Thursday, June 7, 2012 4:50 PM
Marked as answer by CensoredUser Thursday, June 7, 2012 8:04 PM
Edited by Bryan Thomas Friday, June 8, 2012 4:55 PM createFiltered

Thursday, June 7, 2012 4:49 PM

All replies

0

Sign in to vote

Would it be possible to use a filter on WinJS.Binding.List?

http://msdn.microsoft.com/en-us/library/windows/apps/hh700741.aspx

I don't have a Windows 8 machine in front of me right now, but maybe there would be a way to setup a filter that only returns the first x items in each group.

Dave

Thursday, June 7, 2012 4:41 PM