Filter and properties 2.7

by ilaria_nunziante

HTML

<script src="https://cdn.flexmonster.com/2.7/flexmonster.js"></script>
<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btn" onclick="showFilters(event)" data-field="category">Show 'Category' filters</button>
<button id="btn" onclick="showFilters(event)" data-field="product">Show 'Product' filters</button>
<div id="pivot-container"></div>

JavaScript

var pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 430,
  toolbar: true,
  report: {
    dataSource: {
      data: getData()
    },
    slice: {
      rows: [{
        uniqueName: "product"
      }],
      columns: [{
        uniqueName: "[Measures]"
      }],
      measures: [{
        uniqueName: "price"
      }],
      reportFilters: [{
        uniqueName: "category"
      }]
    }
  }
});

showFilters = function(event) {
  var filters = flexmonster.getFilter($(event.srcElement).data('field'));
  if (filters && filters.members && filters.members.length) {
    alert("Filters: \n" + JSON.stringify(filters.members));
  }
  else {
  	alert("Empty filters");
  }
};

function getData() {
  return [{
      "product": {
        type: "string"
      },
      "productID": {
        type: "property",
        hierarchy: "product"
      },
      "category": {
        type: "string"
      },
      "categoryID": {
        type: "property",
        hierarchy: "category"
      },
      "price": {
        type: "number"
      }
    },
    {
      "product": "Banana cake",
      "productID": "0816",
      "category": "Cakes",
      "categoryID": "01",
      "price": 24
    },
    {
      "product": "Apple pie",
      "productID": "2626",
      "category": "Cakes",
      "categoryID": "01",
      "price": 31
    },
    {
      "product": "Spaghetti",
      "productID": "2366",
      "category": "Pasta",
      "categoryID": "02",
      "price": 56
    },
    {
      "product": "Lasagna",
      "productID": "2366",
      "category": "Pasta",
      "categoryID": "02",
      "price": 56
    }
  ];
}