How to load different reports to viewer?

bmark
edited February 11, 2022 in Analytics #1
<p>Hello,</p>
<p> </p>
<p>I'm trying to run one report with different report parameters by JSAPI.</p>
<p> </p>
<p>For test purposes I created two buttons. One button is calling the report with parameter "US" and the other button is calling the report with parameter "NG". Additionaly the report will be displayed in an modal window popup.</p>
<p> </p>
<p>This works exactly once no matter what button I click first. The second time nothing happens. When I reload the site it starts again.</p>
<p> </p>
<p>How can I display different reports or same reports with different parameters in one viewer?</p>
<pre class="_prettyXprint _lang-js">
<!-- The Modal -->
<div id="myModal" class="modal">
<span class="close">x</span>
<div id='inlineViewer' class="modal-content"/>
</div>

<button id="myBtnUS">Open Modal US</button>
<button id="myBtnNG">Open Modal NG</button>

<script type="text/javascript" language="JavaScript" src="http://localhost:8700/iportal/jsapi"></script>
<script type="text/javascript" language="JavaScript">


// Get the modal
var modal = document.getElementById('myModal');

// Get the button that opens the modal
var btnUS = document.getElementById("myBtnUS");
var btnNG = document.getElementById("myBtnNG");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks the button, open the modal
btnUS.onclick = function() {
modal.style.display = "block";
initJSAPI('US');
}

btnNG.onclick = function() {
modal.style.display = "block";
initJSAPI('NG');
}

// When the user clicks on <span> (x), close the modal
span.onclick = function() {
modal.style.display = "none";
document.getElementById('inlineViewer').innerHTML = "";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
document.getElementById('inlineViewer').innerHTML = "";
}
}


var paramValue;

function initJSAPI(countryIsoName) {
paramValue=countryIsoName;
actuate.load("viewer");
var reqOps = new actuate.RequestOptions();
if(!initDone){
initDone=true;
actuate.authenticate("http://localhost:8700/iportal/", null, "xxxxx", "yyyyyy", null, null, null);
}
actuate.initialize("http://localhost:8700/iportal/", reqOps, null, null, runReport);
}

function runReport() {
var viewer = new actuate.Viewer("inlineViewer");

viewer.setParameters({ CountryIso:paramValue});

var viewerwidth = 260;
var viewerheight = 200;
viewer.setWidth(viewerwidth);
viewer.setHeight(viewerheight);

adjustUIOptions(viewer);

viewer.setReportName("/Public/CountryChart.rptdesign");
viewer.submit(submitCallback);
}

function adjustUIOptions(viewer){
var uioptions = new actuate.viewer.UIOptions( );
uioptions.enableToolBar(false);
viewer.setUIOptions(uioptions);
}

function submitCallback(){

}
</script>
</pre>
<p>Thanks for any help</p>
<p> </p>
<p>Benjamin</p>

Comments

  • <p>Hi,</p>
    <p> </p>
    <p>Because you are already <em>initialized</em>, the second time <em>initialize </em>is called, it will not execute the callback class, <em>runReport</em>. You can modified the <em>initJSAPI </em>function to look like this:</p>
    <pre class="_prettyXprint _lang-">
    function initJSAPI(countryIsoName) {
    paramValue=countryIsoName;
    actuate.load("viewer");
    var reqOps = new actuate.RequestOptions();
    if(!initDone){
    initDone=true;
    actuate.authenticate("http://localhost:8700/iportal/", null, "administrator", "", null, null, null);
    actuate.initialize("http://localhost:8700/iportal/", reqOps, null, null, runReport);
    }
    else {
    runReport();
    }
    }

    </pre>
    <p>In other words, call <em>initialize </em>only the first time, then call <em>runReport </em>directly afterwards.</p>
    <p> </p>
    <p>Hope this helps,</p>
    <p> </p>
    <p>P.</p>
    Warning No formatter is installed for the format ipb
  • bmark
    edited November 30, 2016 #3
    <p>Hello Pierre,</p>
    <p> </p>
    <p>thx for your feedback. I implemented it the way you proposed me but still no change.</p>
    <p>I put an several alerts into the code and all alerts fire with the correct values every time I click the button but the report wont change.</p>
    <p> </p>
    <p>Maybe there is still something missing?</p>
    <p> </p>
    <p>Thx</p>
    <p> </p>
    <p>Ben</p>
    <pre class="_prettyXprint _lang-js">
    function initJSAPI(countryIsoName) {
    paramValue=countryIsoName;
    actuate.load("viewer");
    var reqOps = new actuate.RequestOptions();
    alert(initDone);
    if(!initDone){
    initDone=true;
    actuate.authenticate("http://localhost:8700/iportal/", null, "xxxxx", "yyyyy", null, null, null);
    actuate.initialize("http://localhost:8700/iportal/", reqOps, null, null, runReport);
    }else{
    runReport();
    }
    }

    function runReport() {
    alert("run");
    var viewer = new actuate.Viewer("inlineViewer");

    viewer.setParameters({ CountryIso:paramValue});

    var viewerwidth = 260;
    var viewerheight = 200;
    viewer.setWidth(viewerwidth);
    viewer.setHeight(viewerheight);

    adjustUIOptions(viewer);

    viewer.setReportName("/Public/inlineChart.rptdesign");
    viewer.submit(submitCallback);
    }

    function adjustUIOptions(viewer){
    var uioptions = new actuate.viewer.UIOptions( );
    uioptions.enableToolBar(false);
    viewer.setUIOptions(uioptions);
    }

    function submitCallback(){

    }
    </pre>
  • <p>Hi Ben,</p>
    <p> </p>
    <p>I'm a bit puzzled... I am sending you my example (Test.html), as well as a sample report (ShowParam.rptdesign) that displays the value of a parameter. Can you test on your side?</p>
    <p> </p>
    <p>BTW, which version of iHub are you using?</p>
    <p> </p>
    <p>Thanks,</p>
    <p> </p>
    <p>P.</p>
    Warning No formatter is installed for the format ipb