celldoubleclick

[starting from version: 2.3]

It is triggered when a cell is double-clicked on the grid. For CSV and JSON data, the event is also triggered for the drill-through view.

Data passed to the handler

Parameter/Type	Description
cell CellDataObject	Contains information about the clicked cell.

Examples

1) Display an alert on a cell double-click:

flexmonster.on('celldoubleclick', function (cell) {
          alert(
            "Double-clicked a cell - row: "
            + cell.rowIndex + ", column: "
            + cell.columnIndex 
            + ", label: "
            + cell.label);
});

Open the example on JSFiddle.

2) Create custom drill-through functionality using the celldoubleclick event.

First, disable the built-in drill-through feature using the options.drillThrough:

const pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  height: 300,
  report: {
    dataSource: {
      data: getData(),
    },
    slice: {
      // Slice configuration
    },
    options: {
      drillThrough: false,
    },
  },
});

Then, specify the id field type in the mapping:

const pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  height: 300,
  report: {
    dataSource: {
      data: getData(),
      mapping: {
        "accountId": {
          type: "id"
        }
      },
    },
    // Report configuration
  },
});

Add a celldoubleclick event handler:

const pivot = new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  height: 300,
  report: {
    // Report configuration
  },
  celldoubleclick: customDrillThrough,
});

// Event handler
function customDrillThrough(cell) {
}

In the handler, get recordIds of the cell that was double-clicked:

function customDrillThrough(cell) {
  const ids = cell.recordId;
}

Create a function that will find a record in the dataset based on the id:

function getRecords(id) {
  const data = getData();
  for(let i = 0; i < data.length; i++) {
    if(data[i].accountId === id) {
      return data[i];
    }
  }
  return null;
}

Get records that compose the double-clicked cell. You can show the records in a pop-up window, save them in a file, or print them to the console:

function customDrillThrough(cell) {
  const ids = cell.recordId;
  const records = [];
  for(let i = 0; i < ids.length; i++) {
  	records.push(getRecord(ids[i]));
  }
  showOutput(JSON.stringify(records, null, 2));
}

See the full code on JSFiddle.