locked
[WinJS] How to get the selection index or an item in a grouped ListView? RRS feed

  • Question

  • Hello,

    I am working on an application made with WinJS. This application has a listView and the items of that listview are grouped (using model.createGrouped, like in the samples https://msdn.microsoft.com/en-us/library/windows/apps/br211825.aspx).

    Display work great, even for a few thousands of items as they are dynamically loaded (templating is being reused automatically). But because of that template recycling, I cannot find a way to set the selection on an item that is not currently visible.

    Say for instance that I have groups with 100 elements each. Only 50 are displayed by the listview at a certain time (so that there is not too much DOM, this is done automatically by the ListView component).

    I want to be able to select all the elements of a group, to do contextual actions on them. To change the list's selection, I use its "selection" property:

    https://msdn.microsoft.com/en-us/library/windows/apps/br211852.aspx?f=255&MSPPError=-2147217396

    Which takes an array of indices. If my list was not grouped, I could just do

    var idxOfItem = listViewModel.indexOf(item);


    But because my listview is grouped, the indices are not in the order of the model, they are in order of diplay I believe.

    From the documentation of ISelection:

    https://msdn.microsoft.com/en-us/library/windows/apps/hh872207.aspx

    It looks like I can also pass an array of objects with a key propery such as [{key: 1}, {key: 2}, ...] but even if I add a "key" property to my model, selecting elements that way don't seem to work

    Does anybody know how to select a grouped item via an item's property?

    Thanks for your help,

    Fabien

    Sunday, November 20, 2016 4:24 PM

Answers

  • Hi,

    >>But because my listview is grouped, the indices are not in the order of the model, they are in order of diplay I believe.

    The sample you posted has already created the groupedList: 

    var groupedItemsList = itemsList.createGrouped(getGroupKey, getGroupData, compareGroups);

    You can get the group items from this list:

    //get the group items whose title starts with 'V'
    var groupItems = groupedItemsList.filter(function (item, index, array) 
    {
          if (item.title.startsWith("V")) 
          {
              return true;
          }
              return false;
    });

    Best Regards,

    Elvis Xia

    Monday, November 21, 2016 9:38 AM

All replies

  • Hi,

    >>But because my listview is grouped, the indices are not in the order of the model, they are in order of diplay I believe.

    The sample you posted has already created the groupedList: 

    var groupedItemsList = itemsList.createGrouped(getGroupKey, getGroupData, compareGroups);

    You can get the group items from this list:

    //get the group items whose title starts with 'V'
    var groupItems = groupedItemsList.filter(function (item, index, array) 
    {
          if (item.title.startsWith("V")) 
          {
              return true;
          }
              return false;
    });

    Best Regards,

    Elvis Xia

    Monday, November 21, 2016 9:38 AM
  • Thanks A LOT for your answer, it was actually that obvious, just had to do indexOf on the grouped collection instead!

    Fabien

    Monday, November 21, 2016 8:44 PM