Jump to content
We've recently updated our Privacy Statement, available here ×
  • Not able to toggle between 'Viewing' and 'Editing' options of Dashboard embedded using iframe


    Dhiraj Pahlani
    • Features: Dashboards, JasperReports Server, User Interface Product: JasperReports® Server

    Problem:
    Trying to embed Dashboard in application using iframe but not able to change the view between 'Editing' and 'Viewing' as these options are placed far too below the drop-down menu to be able to click on (ISSUE.png screenshot attached).

    Cause:
    This is an issue with the core embedding functionality when working with iframe. A bug report with internal ticket number JS-65837 has been filed to analyze and resolve this issue.

    Solution:
    As this bug is being worked on to be fixed, a workaround, for now, would be to change the top height for the toggle menu in the toggleMenuTemplate.htm file (<jasperserver-pro>optimized-scriptsruntime_dependenciesbi-dashboardsrcdashboardtemplate)

    1. Open the toggleMenuTemplate.htm file in an editor.

    2. Change the top height from 73px to 35px, like:
    <div id="menu" class="menu vertical context toggleView hidden" aria-hidden="true" role="menu" tabindex="-1" js-navtype="actionmenu" style="right:8px; top:35px; z-index: 99999;">
    <div class="content">
    ...
    </div>
    </div>

    3. Save the file, and restart the application server for the changes to reflect.

    4. Next, since we have optimized the script under optimized-scripts, we will need to implement this updated script. See the 'Customizing JavaScript Files' section from our Ultimate Guide:
    https://community.jaspersoft.com/documentation/tibco-jasperreports-server-ultimate-guide/v780/customizing-javascript-files

    We can also test run the solution of editing the top height for the toggle menu before performing the implementation of optimized script by including the parameter &_opt=false in our URL, like:
    http://localhost:8080/jasperserver-pro/dashboard/viewer.html?decorate=no&_opt=false#%2Fpublic%2FSamples%2FDashboards%2F1._Supermart_Dashboard&j_username=superuser&j_password=superuser

    A simple HTML webapp (iFrameDashboard.html attached) that uses minimal HTML and no CSS besides width and height properties and one of the sample Dashboards is attached for reference.
    ______________________________________________________________________________________________________________________________________________________
    Ref. Case #02095785

     

    iframedashboard.html


    User Feedback

    Recommended Comments

    There are no comments to display.



    Create an account or sign in to comment

    You need to be a member in order to leave a comment

    Create an account

    Sign up for a new account in our community. It's easy!

    Register a new account

    Sign in

    Already have an account? Sign in here.

    Sign In Now

×
×
  • Create New...