Dropdown component in the Dashboard Designer

This article explains Dropdown component in the Dashboard Designer using the Open Source BI Helical Insight enterprise version. This feature is available starting from Helical Insight version 5.2.2

This feature enables the creation of advanced custom use cases. For example, we can:

Create a custom dropdown with certain values and trigger define actions which happens based on values by end users, such as:

  • Accessing the report via the JS editor.
  • Opening the report in a tab component.
  • Adding multiple reports into separate tabs.
  • Positioning the report in a custom location.
  • Displaying the report in a custom position within a tab.

Additionally, you can:

  • Set and manage dashboard variables. Click here to learn more about dashboard variables
  • Implement custom JavaScript functionality and invoke methods, such as showing or hiding components, or modifying properties like colors.

We will usage of Dropdown component with a use case by creating two values in the dropdown: “Emp Report” and “Travel Report”. On selecting a dropdown value, the corresponding report opens at a defined position in the Dashboard Designer

Steps to be followed :

Step 1: Open the Dashboard Designer and right-click on an empty space. Choose Add > Dropdown

Dropdown component in the Dashboard Designer

Step2: It opens the drop-down configuration. Enable it to be able to use this.

In the “Values” you can mention the list of all the values comma separated. The values mentioned here will appear as drop down values.

Size – This will be the size of the drop down component which will appear. It has got 3 values – Small, Medium and Large.

Border – This property applies border to the drop down.

Placement – This property sets the position of the drop down list.

Allow Clear – This property when enabled will allow a close button in front of selected values.

We should inject the required login in the JS code ‘On Change Event‘ placeholder.

Dropdown component in the Dashboard Designer

JS Code :

const opts = {layout: {x: 0, y:0, h:4, w:6}}  // defined the position of the component
if(value === "Emp Report") {
open_report("Anji/Blogs/Emp_Report.hr", opts);
}

if(value === "Travel Report") {
open_report("Anji/Blogs/Travel_Information.hr", opts);
}

Note: In order to copy the exact path of the reports to be displayed, click on the file browser of the dashboard and navigate to the particular folder. Hover over the report to copy the path from the tooltip information.

Dropdown component in the Dashboard Designer

Step 3: Click on ‘Apply’ to view the Dropdown code output in the Dashboard Designer.

Step4: Enabled the header for the Dropdown component and provided a name for the component. Align the Dropdown component properly on the dashboard and save it. In open mode, it looks like below :

Dropdown component in the Dashboard Designer

Step4 : Now, select the dropdown value ‘Emp Report.‘ It opens in the position defined in the dropdown configuration.

Refer to the screenshot below.

Dropdown component in the Dashboard Designer

In a similar way, if we select ‘Travel Report‘ it renders in the same position

Note: We can use session variables such as username, organization name, roles, profiles, and filter values in the JS editor of the dropdown when working with custom requirements. When you hover over the help icon, you can view information about all the dynamic variables

Dropdown component in the Dashboard Designer

You May Also Like

Leave a Reply

Helical Insight’s self-service capabilities is one to reckon with. It allows you to simply drag and drop columns, add filters, apply aggregate functions if required, and create reports and dashboards on the fly. For advanced users, the self-service component has ability to add javascript, HTML, HTML5, CSS, CSS3 and AJAX. These customizations allow you to create dynamic reports and dashboards. You can also add new charts inside the self-service component, add new kind of aggregate functions and customize it using our APIs.
Helical Insight’s self-service capabilities is one to reckon with. It allows you to simply drag and drop columns, add filters, apply aggregate functions if required, and create reports and dashboards on the fly. For advanced users, the self-service component has ability to add javascript, HTML, HTML5, CSS, CSS3 and AJAX. These customizations allow you to create dynamic reports and dashboards. You can also add new charts inside the self-service component, add new kind of aggregate functions and customize it using our APIs.
Helical Insight, via simple browser based interface of Canned Reporting module, also allows to create pixel perfect printer friendly document kind of reports also like Invoice, P&L Statement, Balance sheet etc.
Helical Insight, via simple browser based interface of Canned Reporting module, also allows to create pixel perfect printer friendly document kind of reports also like Invoice, P&L Statement, Balance sheet etc.
If you have a product, built on any platform like Dot Net or Java or PHP or Ruby, you can easily embed Helical Insight within it using iFrames or webservices, for quick value add through instant visualization of data.
If you have a product, built on any platform like Dot Net or Java or PHP or Ruby, you can easily embed Helical Insight within it using iFrames or webservices, for quick value add through instant visualization of data.
Being a 100% browser-based BI tool, you can connect with your database and analyse across any location and device. There is no need to download or install heavy memory-consuming developer tools – All you need is a Browser application! We are battle-tested on most of the commonly used browsers.
Being a 100% browser-based BI tool, you can connect with your database and analyse across any location and device. There is no need to download or install heavy memory-consuming developer tools – All you need is a Browser application! We are battle-tested on most of the commonly used browsers.
We have organization level security where the Superadmin can create, delete and modify roles. Dashboards and reports can be added to that organization. This ensures multitenancy.
We have organization level security where the Superadmin can create, delete and modify roles. Dashboards and reports can be added to that organization. This ensures multitenancy.
We have organization level security where the Superadmin can create, delete and modify roles. Dashboards and reports can be added to that organization. This ensures multitenancy.
We have organization level security where the Superadmin can create, delete and modify roles. Dashboards and reports can be added to that organization. This ensures multitenancy.
A first-of-its-kind Open-Source BI framework, Helical Insight is completely API-driven. This allows you to add functionalities, including but not limited to adding a new exporting type, new datasource type, core functionality expansion, new charting in adhoc etc., at any place whenever you wish, using your own in-house developers.
A first-of-its-kind Open-Source BI framework, Helical Insight is completely API-driven. This allows you to add functionalities, including but not limited to adding a new exporting type, new datasource type, core functionality expansion, new charting in adhoc etc., at any place whenever you wish, using your own in-house developers.
It handles huge volumes of data effectively. Caching, Pagination, Load-Balancing and In-Memory not only provides you with amazing experience, but also and does not burden the database server more than required. Further effective use of computing power gives best performance and complex calculations even on the big data even with smaller machines for your personal use. Filtering, Sorting, Cube Analysis, Inter Panel Communication on the dashboards all at lightning speed. Thereby, making best open-source Business Intelligence solution in the market.
It handles huge volumes of data effectively. Caching, Pagination, Load-Balancing and In-Memory not only provides you with amazing experience, but also and does not burden the database server more than required. Further effective use of computing power gives best performance and complex calculations even on the big data even with smaller machines for your personal use. Filtering, Sorting, Cube Analysis, Inter Panel Communication on the dashboards all at lightning speed. Thereby, making best open-source Business Intelligence solution in the market.
With advance NLP algorithm, business users simply ask questions like, “show me sales of last quarter”, “average monthly sales of my products”. Let the application give the power to users without knowledge of query language or underlying data architecture
With advance NLP algorithm, business users simply ask questions like, “show me sales of last quarter”, “average monthly sales of my products”. Let the application give the power to users without knowledge of query language or underlying data architecture
Our application is compatible with almost all databases, be it RDBMS, or columnar database, or even flat files like spreadsheets or csv files. You can even connect to your own custom database via JDBC connection. Further, our database connection can be switched dynamically based on logged in users or its organization or other parameters. So, all your clients can use the same reports and dashboards without worrying about any data security breech.
Our application is compatible with almost all databases, be it RDBMS, or columnar database, or even flat files like spreadsheets or csv files. You can even connect to your own custom database via JDBC connection. Further, our database connection can be switched dynamically based on logged in users or its organization or other parameters. So, all your clients can use the same reports and dashboards without worrying about any data security breech.
Our application can be installed on an in-house server where you have full control of your data and its security. Or on cloud where it is accessible to larger audience without overheads and maintenance of the servers. One solution that works for all.
Our application can be installed on an in-house server where you have full control of your data and its security. Or on cloud where it is accessible to larger audience without overheads and maintenance of the servers. One solution that works for all.
Different companies have different business processes that the existing BI tools do not encompass. Helical Insight permits you to design your own workflows and specify what functional module of BI gets triggered
Different companies have different business processes that the existing BI tools do not encompass. Helical Insight permits you to design your own workflows and specify what functional module of BI gets triggered