Forum Discussion

v-vaaga's avatar
v-vaaga
Frequent Visitor
9 years ago

Can we add report level filter in power bi visuals from code (JavaScript)

Can we add report level filter in power bi visuals from code (JavaScript)
Eric_Zhang's avatar
Eric_Zhang
Microsoft Employee
9 years ago
v-vaaga wrote:

Can we add report level filter in power bi visuals from code (JavaScript)

v-vaaga

Yes.

You can check the JavaScript wiki Filters.

 

Here's a simple demo to practise.

<html>

 <script src="https://microsoft.github.io/PowerBI-JavaScript/demo/bower_components/powerbi-client/dist/powerbi.js"></script>
 <script src="https://microsoft.github.io/PowerBI-JavaScript/demo/bower_components/jquery/dist/jquery.js"></script>  
  
<script type="text/javascript">
window.onload = function () { 

  var  Filter = {
   $schema: "http://powerbi.com/product/schema#advanced",
  target: {
    table: "table Name",
    column: "column Name"
  },
  logicalOperator: "OR",
  conditions: [
    {
      operator: "Contains",
      value: "CN"
    },
    {
      operator: "Contains",
      value: "CO"
    }
  ]
}
 

var embedConfiguration = {
    type: 'report',
    accessToken: 'eyJ..YourTokenHere..w',
    id: 'report ID',
    embedUrl: 'yourEmbedUrlHere',

}; 
 

var $reportContainer = $('#reportContainer');
 
var report = powerbi.embed($reportContainer.get(0), embedConfiguration);
 
report.on('loaded', event => {
  report.getFilters()
    .then(filters => {
      filters.push(Filter);
      return report.setFilters(filters);
    });
});

}
</script>

<div id="reportContainer" powerbi-settings-nav-content-pane-enabled="true"   powerbi-settings-filter-pane-enabled="true"></div>

</html>
  • v-vaaga's avatar
    v-vaaga
    Frequent Visitor
    9 years ago

    Thanks. This approach works fine if we are embedding PowerBI visuals into our html or aspx page. 

    But my requirement is to make it work in online PowerBI (msit.powerbi.com/groups/Some-Report-GUID). I have my custom visual and its corresponding JS. So there I need to add report level filter from code (JavaScript) i.e., without dragging and dropping that filter column.

    • Eric_Zhang's avatar
      Eric_Zhang
      Microsoft Employee
      9 years ago

      v-vaaga

      I'm not aware of any way, where do you put the code?

  • bhanupowerbi's avatar
    bhanupowerbi
    Frequent Visitor
    9 years ago

    Hi Eric_Zhang,

     

    I tried your solution but when my application try to load report, it shows "The Content is not available", But when I load report using  @Html.PowerBIReportFor(m => m.Report, new { id = "pbi-report", style = "height:85vh", powerbi_access_token = Model.AccessToken }) with filter, It getting loadded.

    Is I am doing something wrong?

    Pleae help

    • Eric_Zhang's avatar
      Eric_Zhang
      Microsoft Employee
      9 years ago
      bhanupowerbi wrote:

      Hi Eric_Zhang,

       

      I tried your solution but when my application try to load report, it shows "The Content is not available@", But when I load report using  @Html.PowerBIReportFor(m => m.Report, new { id = "pbi-report", style = "height:85vh", powerbi_access_token = Model.AccessToken }) with filter, It getting loadded.

      Is I am doing something wrong?

      Pleae help

       

      "The Content is not available" is usually due to an invalid token. What do you get from the network traffic in a dev tool(F12 in Chrome).