GetHtmlCell

by ilaria_nunziante

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>
<button onclick="getHtmlCell()">Get html cell</button>

<div id="pivot-container">The component will appear here</div>

JavaScript

let mapping1 = {
  Quantity: {
    type: "number"
  },
  Product: {
    type: "string"
  },
  Month: {
    type: "string"
  },
  Year: {
    type: "string"
  }
}
let mapping2 = {
  Quantity: {
    type: "number"
  },
  Product: {
    type: "string"
  },
  Month: {
    type: "level",
    level: "Month",
    parent: "Year",
    hierarchy: "Time"
  },
  Year: {
    type: "level",
    level: "Year",
    hierarchy: "Time"
  }
}
var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  toolbar: true,
  report: {
    dataSource: {
      data: getData(),
      mapping: mapping1
    },
    options: {
      editing: true
    }
  }
});

function getData() {
  let count = 20000;
  let data = [];
  for (var i = 0; i < count; i++) {
    for (var j = 7; j <= 12; j++) {
      let item = {
        Quantity: 1,
        Product: 'Product ' + i,
        Month: 'Month' + j,
        Year: 2020
      }
      data.push(item);
    }
    for (var j = 1; j <= 6; j++) {
      let item = {
        Quantity: 1,
        Product: 'Product ' + i,
        Month: 'Month' + j,
        Year: 2021
      }
      data.push(item);
    }
  }
  return data;
}

function getHtmlCell() {
  data = flexmonster.getSelectedCell();
  if (!data) {
    alert('none selected');
  }
  elm = $('.fm-grid-view [data-r="' + data.rowIndex + '"][data-c="' + data.columnIndex + '"]');

  alert('length: ' + elm.length);
}