JavaScript to pass multi-select search options as external parameters to another DataPage

[OlRiv]

Hi, I have a dashboard that contains one parent datapage (a stacked area chart) and several child datapages (pie charts) embedded as iframes in the footer of the parent datapage. The search terms for the parent datapage are configured to pass as external parameters to the child datapages. This works for all search terms where just one option is selected, but not for multi-select listboxes. Based on previous posts I've tried the following JavaScript to pass the multi-select listbox parameters, but with no success. Any suggestions? Thank you all!

<script type="text/javascript">

var fieldName = "Value4_1";

var x1=document.getElementsByName(fieldName);

x1[0].multiple=true;

document.addEventListener('FormSubmitted', function(event) {

var result = "";

for (var i = 0; i < x1[0].length; i++) {

if (x1[0].options[i].selected) {

result += "\"" + x1[0].options[i].value + "\"" + " OR " ;

}

}

document.getElementById("Value4_1").value = result;

});

</script>

 

[Kurumi]

Hi @OlRiv - you may to check this post:
 

 

[OlRiv]

This is exactly what I needed. Thank you!

This is the final code I used on the child datapages. The style section hides the search form, while the script initiates a search that carries forward the filters from the parent datapage.

<style>
.cbSearchSpa {

display:none !important;

}
</style>

<script type="text/javascript">
    
document.addEventListener('DataPageReady', function (event) {

let buttons = document.querySelectorAll(".cbSearchButton");

//adding onclick event listener to the 1st DP search form
  
buttons[0].addEventListener("click", ()=> {
    
    //clicking on search button of 2nd DP with a delay
  
    setTimeout(()=>{buttons[1].click();}, 500)


}, false);

});
</script>