Reorder with custom data and sections

@Kai wrote:

I’m working on a listview where users can reorder/move items between date sections. So the reordering with list-headers are working fine and it’s returning which row is moved to a new position. But I especially want to know two things:

1. If a row is moved, I want to know the ion-item unique ID (coming from API)
2. If a row is moved to a new date section, I want to know that new date.

So I have this default code below, but is it possible to add custom data to an ion-item and get value that after moving? And secondly how can I create date sections in an ion-reorder so I know an ion-item has been moved from section 13-05-2020 to 16-05-2020? I tried multiple reorder-groups but that doesn’t work. Since I’m combining multiple data points, it’s hard to work with the index values.

<ion-list class="nopadding">
  <ion-reorder-group (ionItemReorder)="doReorder($event)" disabled="false">
    
  <ion-list-header>13-05-2020</ion-list-header>
     
    <ion-item>
      <ion-label>Item 1</ion-label>
      <ion-reorder></ion-reorder>
    </ion-item>
    <ion-item>
      <ion-label>Item 2</ion-label>
      <ion-reorder></ion-reorder>
    </ion-item>

  <ion-list-header>14-05-2020</ion-list-header>

    <ion-item>
      <ion-label>Item 3</ion-label>
      <ion-reorder></ion-reorder>
    </ion-item>

  <ion-list-header>15-05-2020</ion-list-header>

    <ion-item>
      <ion-label>Item 4</ion-label>
      <ion-reorder></ion-reorder>
    </ion-item>

  </ion-reorder-group>
</ion-list>

Posts: 1

Participants: 1

Read full topic