Jack Flint
Jack Flint

Reputation: 238

Removing an item from a WinJS.Binding.List

I looked at the Controls_ListViewWorkingWithDataSources MSDN sample to see how to remove an item from a WinJS.Binding.List and here's their solution. Please tell me there's an easier way.

if (list2.selection.count() > 0) {
    list2.selection.getItems().done(function (items) {

        //Sort the selection to ensure its in index order
        items.sort(function CompareForSort(item1, item2) {
            var first = item1.index, second = item2.index;
            if (first === second) {
                return 0;
            }
            else if (first < second) {
                return -1;
            }
            else {
                return 1;
            }
        });

        //Work backwards as the removal will affect the indices of subsequent items
        for (var j = items.length - 1; j >= 0; j--) {
            // To remove the items, call splice on the list, passing in a count and no replacements
            lettersList.splice(items[j].index, 1);
        }
    });

Upvotes: 1

Views: 2455

Answers (3)

Maurizio In denmark
Maurizio In denmark

Reputation: 4284

I would use the remove method on the datasource, so same thing but longer :) :

if (list2.selection.count() > 0) {
    list2.selection.getItems().done(function (items) {

    //Sort the selection to ensure its in index order
    items.sort(function CompareForSort(item1, item2) {
        var first = item1.index, second = item2.index;
        if (first === second) {
            return 0;
        }
        else if (first < second) {
            return -1;
        }
        else {
            return 1;
        }
    });

    //Work backwards as the removal will affect the indices of subsequent items
    for (var j = items.length - 1; j >= 0; j--) {

             var _dataSource = list2.itemDataSource;
             //Start the sequence of edits
             _dataSource.beginEdits();

             //Get new Items that will be added to the existing item source
             var newItems = { "id": selection[i].data.id, "name": selection[i].data.name };
             //remove the last item
             _dataSource.remove(_dataSource.itemFromIndex(indicesList[j])._value.key);

             //YOU CAN EVEN ADD A NEW ITEM IF YOU WANT
             //_dataSource.insertAtStart(null, newItems);

             //Ends the batch of edits
             _dataSource.endEdits();

    }
});

}

Upvotes: 1

Szymon Rozga
Szymon Rozga

Reputation: 18178

You can avoid the getItems() call and the then block by using:iSelection.getIndices();. This gives you an array with the indices you need to remove.

So the code would be more like this. Haven't tested this.

// nothing in docs guarantees these are returned in sorted order, so we need to sort
var indicesList = list2.selection.getindices().sort(function(a,b){return a-b}); 
for (var j = indicesList .length - 1; j >= 0; j--) {
    // To remove the items, call splice on the list, passing in a count and no replacements
    lettersList.splice(indicesList[j], 1);
}

Encapsulate it into a utily class like this:

function deleteSelectedItemsFromList(selection, list) {
    var indicesList = selection.getIndices().sort(function(a,b){return a-b}); 
    for (var j = indicesList .length - 1; j >= 0; j--) {
        // To remove the items, call splice on the list, passing in a count and no replacements
        list.splice(indicesList[j], 1);
    }
}

Call like this:

Utils.deletedSelectedItemsFromList(listview.selection, listViewList);

Bam, you've got a one liner.

Upvotes: 1

RSW
RSW

Reputation: 1667

The code to remove the item in the MSDN sample is more complex because it supports deleting multiple items from a list when those items might not be in consecutive order. Note where they retrieve all of the currently selected items in the list by use of list2.selection.getItems() in their code. For example, given a list containing [1,2,3,4,5,6,7,8,9,0], the MSDN sample code would allow the user to multi-select and delete items 1,2,4,7,9 leaving [3,5,6,8,0] in the list.

If all you want to do is delete a single item from a WinJS.Binding.List (or multiple consecutive items), you can accomplish this with a single call to WinJS.Binding.List.splice() and skip all the extra code in the MSDN sample.

Upvotes: 1

Related Questions