API calls getCondition and getAllConditions

Conditional formatting

by Flexmonster Pivot Table

HTML

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

<div>
  <p>
    Click the <b>Add Condition</b> button to add a conditional formatting rule
    with <code>id = 1</code> for cell values.
  </p>
  <p>
    Click the <b>Get Condition</b> button to output the conditional formatting
    with <code>id = 1</code> under the component.
  </p>
  <p>
    Click the <b>Get All Conditions</b> button to get all conditional formatting
    rules in the report.
  </p>
  <p>The output will appear under the component.</p>
</div>

<button onclick="add()">Add condition</button>
<button onclick="getCondition()">Get condition</button>
<button onclick="getAllConditions()">Get all conditions</button>

<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

const pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 260,
  report: {
    "dataSource": {
      "filename": "data/data.csv"
    }
  }
});

function add() {
  let condition = {
    id: 1,
    formula: '#value > 400000',
    format: {
      backgroundColor: "#33BB33"
    },
  };
  pivot.addCondition(condition);
  pivot.refresh();
}

function getCondition() {
  let id = 1;
  let condition = pivot.getCondition(id);
  showOutput(JSON.stringify(condition, null, 2));
}

function getAllConditions() {
  let conditions = pivot.getAllConditions();
  showOutput(JSON.stringify(conditions, null, 2));
}

function showOutput(content) {
  document.getElementById("output").innerText = content;
}