RadListView Item Reorder

The item reorder feature allows the end users to change the position of an item by dragging it. This is particularly useful in scenarios where lists of items with priorities are created. Reordering an item is used to change the item's priority. The Item Reorder feature is enabled by setting the itemReorder property to true.

You can take a look at the following article about the Item Reorder functionality: Item Reorder

Example

The following simple scenario demonstrates how the item-reorder feature is used. A handler for the itemReordered event is provided which prints out the indices of the item being reordered.

<RadListView row="1" [items]="dataItems" itemReorder="true" (itemReordered)="onItemReordered($event)">

export class ListViewItemReorderComponent implements OnInit {
    private _dataItems: ObservableArray<DataItem>;

    constructor(private _dataItemService: DataItemService) {
    }

    get dataItems(): ObservableArray<DataItem> {
        return this._dataItems;
    }

    ngOnInit() {
        this._dataItems = new ObservableArray(this._dataItemService.getPersonDataItems());
    }

    public onItemReordered(args: ListViewEventData) {
        console.log("Item reordered. Old index: " + args.index + " " + "new index: " + args.data.targetIndex);
    }
}