Successfully!

Error!

JS Pagination and Refresh of Report Blocks in Dashboards

  • Last update:  2020-12-16
  • I. Overview

    1.1 Requirement

    Sometimes we just want to refresh a report block in a decision-making report rather than the whole report. How can a report block in a report be refreshed? And how can a report block skip to a specified page, as shown below?

    1) Click button0 to allow the report block to skip to page 2. In the report, parameter values are normally obtained through formulas $month and $name

    2) Click button1 to refresh the report block every second

     

    1.2 Solution

    JS supports locally refreshing and skipping to a specified page.

    this.options.form.getWidgetByName("repotname").gotoPage(pn, para, noCache)

    Parameter

    Type

    Description

      pn

      Number

     Page number which starts from 1

      para

      JSON

      Optional, a parameter generated when skipping to a specified page

    noCache

      Boolean

      Optional, if true, use no cache and get new data when the report block skips to a specified page

    For example:

    this.options.form.getWidgetByName("report0").gotoPage(2,"{month:12, name:'FR'}",true);

    It can be achieved by inputting the JS code above. In the code, report0 is the name of the report block, which will skip to page 2 and pass the parameter $month whose value is 12, the value of $name is FR and no cache is used.

    II. Sample

    2.1 Design a template

    Create a new decision-making report, drag two buttons, i.e., button0 and button1, and two report blocks, i.e., report0 and report1, into the report.

    2.1.1 Design report0

    1) Design the report block report0 as follows:

     

    2) Select cells B5B10 and B15, click Cell Attributes>Other and set Paginate After Row, as shown below:

     

    2.1.2 Design report1

    Edit the report block report1 and add the formula =now() to A1, as shown below:


    2.2 Turn the page of a report block

    Select button0, click Widget Setting>Event and add a Click event, as shown below:

     

    Input the JS code:

    this.options.form.getWidgetByName("report0").gotoPage(2,"{month:12, name:'FR'}",true); 
    //The report block skips to another page and pass parameters month and name

     

    2.3 Locally refresh a report block

    Select button1, click Widget Setting >Event and add a Click event, as shown below: 

    Input the JS code:

    var form = this.options.form;setInterval(function() {
         form.getWidgetByName('report1').gotoPage(1,"{}",true);
    }, 1000); //Refresh the report block report1

    Save the template and click button1. Then the report block report1 is refreshed every second

    III. Preview

    Save the templates and select [Dashboard Preview]. The preview effect is as shown below:

    IV. Download the template

    Attachment List


    Theme: Dashboard
    Already the First
    Already the Last
    • Helpful
    • Not helpful
    • Only read

    Doc Feedback