How to remove group of items from Listview

This article explains how to remove a group of items from a ListView.

We can remove multiple items from ListView using the removeMultipleItems API. In the sample below, we removed a group of list items based on their category.

Follow below steps below to achieve this,

• Use dataManager to filter the list items based on category.
• And pass the filtered data to the removeMultipleItems API to remove the list items from the ListView.

 Refer to the below code snippet

//Initialize ListView component

var grpListObj = new ej.lists.ListView({

 

    //Set defined data to dataSource property

    dataSource: cars,

 

    //Map the appropriate columns to fields property

    fields: { groupBy: 'category', text: 'columntext', id: 'columnid' },

 

    select: onSelect

 

});

 

//Render initialized ListView component

grpListObj.appendTo('#listview-grp');

 

function onSelect(event){

var value = event.data.category;

var data = new ej.data.DataManager(cars).executeLocal(

new ej.data.Query().where("category", "equal", value, true)

); // Filter the list items by its category

if (value) {

 grpListObj.removeMultipleItems(data); // Remove the filtered data

 

}

}

 Refer to the working sample for additional details and implementation: Sample