CODEWITHSUNDEEP
javascripttabulator
Greg D
Greg D

Reputation: 13

Tabulator moveable rows -- how to select / move multiple items at one time

Using Tabulator 4.7, I have implemented an app that has moving items between tables, much like this example:

http://tabulator.info/examples/4.7?#movable-between-tables

However, I can't figure out how to select and move multiple items at one time. I'm not sure if it is even possible, since when I use something like

            selectable:5,

along with

            movableRows:true,
            movableRowsConnectedTables:otherTableIDs,
            movableRowsReceiver: "add",
            movableRowsSender: "delete",

it doesn't change the behavior. Any help would be appreciated!

Upvotes: 0

Views: 640

Answers (2)

Scott
Scott

Reputation: 41

For moving multiple rows within a single table, this code will do the trick.

The rowMoving event to used to identify rows that are selected.

 rowMoving = (row) => {
    this.rowsToMove = [];
    let rows = this.tableInst.getRows();
    for (let row of rows) {
      let rowData = _.cloneDeep(row.getData());
      if (row.isSelected()) {
        this.rowsToMove.push(rowData);
      }
    }
  };

The rowMoved event is used to insert the rowsToMove into the dragged-to location in the table.

  rowMoved = (row) => {
    let rowsToMove = this.rowsToMove;
    let rowsOrg = this.tableInst.getData();
    let rowsNext = [];
    let rowsHaveBeenMoved = false;
    for (let row of rowsOrg) {
      if (this.isRowsToMove(rowsToMove, row)) {
        if (!rowsHaveBeenMoved) {
          for (let r of rowsToMove) {
            rowsNext.push(r);
          }
          rowsHaveBeenMoved = true;
        }
      } else {
        rowsNext.push(row);
      }
    }
    this.tableInst.replaceData(rowsNext);
  };

This helper function is used to see if a row matches any of the rowsToMove.

  isRowsToMove = (rows, row) => {
    let match = false;
    for (let r of rows) {
      if (_.isEqual(r, row)) {
        match = true;
        break;
      }
    }
    return match;
  };

Upvotes: 1

Oli Folkerd
Oli Folkerd

Reputation: 8348

As of version 4.7, You cannot move multiple rows at a time with Tabulator.

The Movable Rows functionality only allows for one row to be moved at a time.

This functionality is on the development roadmap for after the 5.0 release

Upvotes: -1

Related Questions