Forum Discussion
Power BI Embedded: Problem using more than one filter on the same Embedded exporting all the Visuals
Hi, we solved it it was the [] characters when sending the filter.
I attach the solution!! Thanks!
function ReplaceFilters() {
//var a = $("#In1").val();
//var b = $("#In2").val();
const filterList = [{
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "tCalendarioNestleN",
column: "SemanaNestle"
},
logicalOperator: "And",
conditions: [{
operator: "GreaterThanOrEqual",
value: 1
}, {
operator: "LessThanOrEqual",
value: 5
}]
},
{
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "tProductos",
column: "cveCategoria"
},
operator: "In",
values: ["PURINA"]
}];var embedContainerPortafolio = $('#TendenciaSOut')[0];
var reportPortafolio = powerbi.get(embedContainerPortafolio); // Replace all report's filters.try {
reportPortafolio.setFilters( filterList);
// reportPortafolio.setFilters([filterList]); this was the one you sent us.
} catch (errors) {
console.log(errors);
}
/* catch (errors) { console.log(errors); }*/
}
Hi Hugo_Gallardo,
It sounds like you want to use multiple filters to your report based on setfilters function.
After I check the documents, I found its parameter is a filter array, so I think you can create an array to store multiple filters that you can define and can use it in filter parameter to use in setfilters:
Use filters when embedding a report in Power BI embedded analytics | Microsoft Docs
Regards,
Xiaoxin Sheng
Hi, let me show you our use case:
We are embedding different visuals on one razor page, and we are also using javascript API on a asp.net core razor page.
This is the webapp, we have a slider and a selector (the selector is not showed cause the value is setted up on the “aplicar filtro” button.
We need to use “N” tables on one action so we can do the parametrics on every visual.
The function is the following:
function filter1() {
var a = $("#In1").val();
var b = $("#In2").val();
const filter1 = [{
$schema: http://powerbi.com/product/schema#basic,
target: {
table: "tCalendarioNestleN", //this is the first table we call with the slider, this actually is the only one that works and when is selected, it actually affects every visual on the screen. But this is not the only table we call. This is the first filter we send and works.
column: "SemanaNestle"
},
logicalOperator: "And",
conditions: [
{
operator: "GreaterThanOrEqual",
value: a
},
{
operator: "LessThanOrEqual",
value: b
}
]
},
{
$schema: http://powerbi.com/product/schema#basic,
target: {
table: "tProductos", // this is the second table we call, the column should affect as well the whole screen. We can actually affect a lot of tables within power BI but when we embed every visual we can’t get the same effect. We found this code on your database.
column: "cveCategoria"
},
logicalOperator : "In",
conditions:[{value : "SP"}] // this is the value setted up, we will have checkboxes for the user to select N values in an array which will be values “SP”, “MG”, etc and the user can see N table filters affecting that
}
]
var embedContainerC = $('#ChartFR')[0];
var reportC= powerbi.get(embedContainerC);
reportC.setFilters([filter1])
}
For now, we have two buttons affecting the dashboard separately and it works but we need that the user can select n values that affects table columns and does shows up in the webapp.
These are both filters working out in separate calls but we need to do every filter on every table in just one call:
function filter1() {
var a = $("#In1").val();
var b = $("#In2").val();
const filter1 = {
$schema: http://powerbi.com/product/schema#basic,
target: {
table: "tCalendarioNestleN",
column: "SemanaNestle"
},
logicalOperator: "And",
conditions: [
{
operator: "GreaterThanOrEqual",
value: a
},
{
operator: "LessThanOrEqual",
value: b
}
]
};
var embedContainerC = $('#ChartFR')[0];
var reportC= powerbi.get(embedContainerC);
reportC.setFilters([filter1])
}
function filter2() {
const filter2 = {
$schema: http://powerbi.com/product/schema#basic,
target: {
table: "tProductos",
column: "cveCategoria"
},
operator: "In",
values: ["SP"]
};
var embedContainerPortafolio = $('#ChartFR')[0];
var reportPortafolio = powerbi.get(embedContainerPortafolio);
reportPortafolio.setFilters([filter2])
}
We can call separate filters but we need them altogether.
We saw in your forum that this can’t be done but we don’t believe that’s accurate.
HI Hugo_Gallardo,
I found you define multiple functions with filter structures to apply filters effect to your report, so I recommend you to transform them into one const variable and use it to set/update filters.
function ReplaceFilters() { var a = $("#In1").val(); var b = $("#In2").val(); const filterList = [{ $schema: "http: //powerbi.com/product/schema#basic", target: { table: "tCalendarioNestleN", column: "SemanaNestle" }, logicalOperator: "And", conditions: [ { operator: "GreaterThanOrEqual", value: a }, { operator: "LessThanOrEqual", value: b } ] }, { $schema: "http: //powerbi.com/product/schema#basic", target: { table: "tProductos", column: "cveCategoria" }, operator: "In", values: ["SP"] }]; var embedContainerPortafolio = $('#ChartFR')[0]; var reportPortafolio = powerbi.get(embedContainerPortafolio); // Replace all report's filters. try { reportPortafolio.updateFilters(models.FiltersOperations.ReplaceAll, [filterList]); } catch (errors) { console.log(errors); } }Power BI Playground - Developer Sandbox
Regards,
Xiaoxin Sheng
I get the following error
powerbi.min.js:4 Uncaught TypeError: Cannot read property 'powerBiEmbed' of undefined
at t.get (powerbi.min.js:4)
at ReplaceFilters1 (SellOut:2339)
at HTMLButtonElement.onclick (SellOut:1)
t.get @ powerbi.min.js:4
ReplaceFilters1 @ SellOut:2339
onclick @ SellOut:1FUNCTION }
var reportPortafolio = powerbi.get(embedContainerPortafolio); // Replace all report's filters.
try { reportPortafolio.updateFilters(models.FiltersOperations.ReplaceAll, [filterList]); } catch (errors) { console.log(errors); }
}
Ok last update, we changed the code as follows but only does the last filter, but it shows us the kind of json it expects in the following image. Do we need to change the json?
const filterList = ([{
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "tCalendarioNestleN",
column: "SemanaNestle"
}
logicalOperator: "And",
conditions: [{
operator: "GreaterThanOrEqual",
value: 1
}, {
operator: "LessThanOrEqual",
value: 5
}]
},
{
$schema: "http://powerbi.com/product/schema#basic",
target: {
table: "tProductos",
column: "cveCategoria"
},
operator: "In",
values: ["PURINA"]
}]);var embedContainerPortafolio = $('#TendenciaSOut')[0];
var reportPortafolio = powerbi.get(embedContainerPortafolio); // Replace all report's filters.try {
reportPortafolio.setFilters([filterList]);
} catch (errors) {
console.log(errors);
}
/* catch (errors) { console.log(errors); }*/