Event handlers

Events

by Flexmonster Pivot Table

HTML

<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<p>
  Interact with the component to trigger the Flexmonster events that output the
  messages about the events under the component.
</p>

<div id="pivot-container"></div>

<div class="output" id="output">Output will appear here</div>

CSS

@import url(https://cdn.flexmonster.com/assets/jsfiddle-styles.css);

JavaScript

let outputInitialized = false;

function showOutput(content) {
  let log = "[Event] " + (new Date()).toLocaleTimeString('en-US') + ": " + content;
  let outputElement = document.getElementById("output");
  if (!outputInitialized) {
    outputElement.innerText = '';
    outputInitialized = true;
  }
  outputElement.innerText += log + "\n";
  outputElement.scrollTop = outputElement.scrollHeight;
}

const pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  cellclick: function() {
    showOutput("cellclick ");
  },
  celldoubleclick: function() {
    showOutput("celldoubleclick ");
  },
  dataerror: function() {
    showOutput("dataerror");
  },
  datafilecancelled: function() {
    showOutput("datafilecancelled");
  },
  dataloaded: function() {
    showOutput("dataloaded");
  },
  fieldslistclose: function() {
    showOutput("fieldslistclose");
  },
  fieldslistopen: function() {
    showOutput("fieldslistopen");
  },
  filteropen: function() {
    showOutput("filteropen");
  },
  loadingdata: function() {
    showOutput("loadingdata");
  },
  loadinglocalization: function() {
    showOutput("loadinglocalization");
  },
  loadingolapstructure: function() {
    showOutput("loadingolapstructure");
  },
  loadingreportfile: function() {
    showOutput("loadingreportfile");
  },
  localizationerror: function() {
    showOutput("localizationerror");
  },
  localizationloaded: function() {
    showOutput("localizationloaded");
  },
  olapstructureerror: function() {
    showOutput("olapstructureerror");
  },
  olapstructureloaded: function() {
    showOutput("olapstructureloaded");
  },
  openingreportfile: function() {
    showOutput("openingreportfile");
  },
  querycomplete: function() {
    showOutput("querycomplete");
  },
  queryerror: function() {
    showOutput("queryerror");
  },
  ready: function() {
    showOutput("ready");
 ...