update WinJS.Binding.List on Splice

Question

I am building an App similar to the Grid App Template for Windows 8 using Javascript and the winJS framework. For one of my pages lots of my items have the same value and I have returned just 1 item for each of these different values using the .createFiltered. This is working great for adding new items because the .createFiltered method updates and checks to see if my new item has a new value.

The issue I am having is with removing items. When I splice the WinJS list there is a chance it is the removing the item which which the .createFiltered method has returned for the repeated value, but there are still other items about with that value. So i need the .createFiltered to run again and then pick a different item.

I will give you an example.

I have 5 items with 2 types's between them "Apple" and "banana".

On my home page I have sorted the items into Fruit / Vegetables / Sweets. These 5 items all come under fruit but instead of giving the different brands I just want it to say "Apple" and "Banana" so I have a function that will get one item for each type and bind it to a WinJS.Binding.Template and then use "textContent: Type" to display Apple / Banana.

Say I have 2 apples "Gala" and "Granny Smith" and I have bound the data of "Gala" to the home page and I then run out of "Gala" Apples (deleting it). I still have Apples in stock (Granny Smith) so I need to .createFiltered function to run again as the Home Page no longer displays "Apples" under Fruit.

Thank you

Answer 1

Since writing this I have managed to find a way to get it to work. What I have done is found the value of the item I am deleting and then gone through the array to see if I can find another item with that value. I have then removed that from the list and then re-added it causing .createFiltered to process the item.

The exact code:

function dashRefresh(toDelete) {
    //Project Key of Deleted Item
    var deletedProjectKey = toDelete.data.project.key;
    //Use new item to bind project data
    var newProjectBinder = 0;
    var newProjectBinderIndex;

    for (var i = 0; i < list.length; i++) {
        var listItem = list.getAt(i);
        if (listItem.project.key == deletedProjectKey) {
            newProjectBinder = listItem;
            newProjectBinderIndex = i;
            i = list.length;
        }
    }

    if (newProjectBinder != 0) {
        list.splice(newProjectBinderIndex, 1);
        list.push(newProjectBinder);
    }
}