topic Re: Adding Filter using JavaScript API in Developer

Adding Filter using JavaScript API

khushbu123 — Fri, 04 Oct 2019 18:19:07 GMT

I have smilar issue but When I am adding Filter I have multiple parameter so if one of them is blank or null its not throwing filter at all.

following is prototype of my code

const filter1= {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "Table1",
column: "column1",
},

operator: "In",
values: [$("#val1").val()]
};

const filter2 = {

$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "Table2",
column: "column2",
},

operator: "In",
values: [$("#val12").val()],
};

var config = {
type: 'report',
tokenType: models.TokenType.Embed,
accessToken: accessToken,
embedUrl: embedUrl,
id: embedReportId,
permissions: models.Permissions.All,
filters: [filter1, filter2],
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
}
};

var reportContainer = $('#DivContainer')[0];

// Embed the report and display it within the div container.
var report = powerbi.embed(reportContainer, config);

report.setFilters([filter1, filter2]);

</script>

so If filter2 is blank or null its not filtering Filter1 my charts ges blanks after this

Re: Adding Filter using JavaScript API

JoshoDotNZ — Sat, 05 Oct 2019 09:35:01 GMT

Soooo, in theroy.

According to the Wiki https://github.com/Microsoft/PowerBI-JavaScript/wiki/Filters

report.removeFilters();

Will remove the filter, but have never managed to get that to work ?!?!

Also you shouldn't need this line in your code, as you have already applied it in the config

report.setFilters([filter1, filter2]);

So leading into that, you should be able to remove the filters from the config before pulling the report, saving more qureys to PowerBI Embedded

Just after var config{}
Stupid code

 if ($("#val1").val() == "" && $("#val12").val() == "") {
config.filters = [];
} else if ($("#val1").val() == "") {
config.filters = [filter2];
} else if ($("#val12").val() == "") {
config.filters = [filter1];
}

Haven't tested or know if syntax is correct lol.

If it works solution it! if you change comment in what you did so others can learn!

Re: Adding Filter using JavaScript API

Anonymous — Sun, 06 Oct 2019 23:43:14 GMT

Why dont you just put an if statement around the whole thing? Check the values before even creating the filter object?

<script>

if($("#val1").val() && $("#val12").val()] {

const filter1= {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "Table1",
column: "column1",
},

operator: "In",
values: [$("#val1").val()]
};

const filter2 = {

$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "Table2",
column: "column2",
},

operator: "In",
values: [$("#val12").val()],
};

var config = {
type: 'report',
tokenType: models.TokenType.Embed,
accessToken: accessToken,
embedUrl: embedUrl,
id: embedReportId,
permissions: models.Permissions.All,
filters: [filter1, filter2],
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
}
};


var reportContainer = $('#DivContainer')[0];

// Embed the report and display it within the div container.
var report = powerbi.embed(reportContainer, config);

report.setFilters([filter1, filter2]);
}
</script>

You can aslo check that the .val() != "" if you wanted too. If you want filter1 to run even if filter2 is not valid then

<script>
let filter1 = null;
let filter2 = null;
if($("#val1").val() && $("#val1").val() != "") {

filter1= {
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "Table1",
column: "column1",
},
}
operator: "In",
values: [$("#val1").val()]
};
if($("#val12").val() && && $("#val2").val() != "") {
filter2 = {

$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "Table2",
column: "column2",
},

operator: "In",
values: [$("#val12").val()],
};
}

var config = {
type: 'report',
tokenType: models.TokenType.Embed,
accessToken: accessToken,
embedUrl: embedUrl,
id: embedReportId,
permissions: models.Permissions.All,
settings: {
filterPaneEnabled: false,
navContentPaneEnabled: false
}
};


var reportContainer = $('#DivContainer')[0];

// Embed the report and display it within the div container.
var report = powerbi.embed(reportContainer, config);
if(filter1 && filter2) {
report.setFilters([filter1, filter2]);
} else if(filter1) {
report.setFilters([filter1]);
} else if(filter2) {
report.setFilters([filter2]);
}
</script>

The main thing is to set those only if there are values available, do not set the fitlers in the config, and instead set them where you are below, but make sure the filter does not equal null before adding it. Hope that helps.