1

I have an event listener that records the value of a toggle slicer in my application. The toggle can have value set to OFF or ON.

I have a variable called filteredValue which contains the value of the current toggle state

   let filteredValue = state.filters[0].values;

I need to apply an action when the value of that variable changes.

eg

report.on('rendered', async () => {

//get all pages
  const pages = await report.getPages()

  //get active page
  let activePage = pages.filter(function(page) {
    return page.isActive
  })[0];

//get visuals on active page
  let visuals = await activePage.getVisuals();

//find target visual
  const TargetVisual = visuals.filter(function(visual) {
    return visual.name === "259fea6751434e7910b4" 
  })[0];

//get current state of visual 
  const state = await TargetVisual.getSlicerState();
  
  
//get current state value (on or off )
let filteredValue = state.filters[0].values


// DO SOMETHING HERE ONLY WHEN filteredValue CHANGES 

}
Gangrel
  • 449
  • 4
  • 20
  • 1
    Does this answer your question? [Listening for variable changes in JavaScript](https://stackoverflow.com/questions/1759987/listening-for-variable-changes-in-javascript) – Abir Taheer Oct 12 '21 at 08:13
  • A better approach would be to add a `change` event handler to the toggle control in the DOM. Listening for a variable to change at runtime is not good practice. – Rory McCrossan Oct 12 '21 at 08:19
  • @RoryMcCrossan thanks - I guess I'm quite restricted. The toggle control itself is managed in Power BI, and the slicerState is the only available variable that gets surfaced. – Gangrel Oct 12 '21 at 08:24
  • In that case you possibly could use a [delegated event handler](https://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) – Rory McCrossan Oct 12 '21 at 08:27

0 Answers0