In Bold BI, you can control the overall interaction between the dashboard widgets using the events. You can manipulate the dashboard widget elements on the client-side and can control their behavior also. Consider the following embedding sample, the Chart, and Cards controls are Bold BI widget controls and the other controls are JS controls.
The above dashboard is available in this link.
JS controls data are loaded from the same database, which we used for the Bold BI widgets controls.
Work Order Number
filter and click the Work Order Number
column data from the Grid JS control, the Bold BI chart widget data will be changed accordingly.Organization and Work Order Number
filters value, the Grid JS control data will be changed accordingly.Organization -> Work Order Number -> Crew -> Zone
.
6. Using this Breadcrumb, we can remove the child level of hierarchy filter.
7. We can also show the filter overview options like in the following image. Using this, we can remove the particular filter value data.
8. If we click any column from the Bold BI chart widget, it will navigate to the new page to render the Grid JS control with the clicked column value. In this case, we are able to pass the context values from the Bold BI widgets to external applications. And also, we can filter the data based on the applied filters and can show the filters data as follows,
Also, you can refer to the this Sample Browser to know more about the linking events to get the context values to pass to the external application.
9. If we click the
Organization
data column in the grid, it will navigate to the home page with the existing and newly applied filter, and the home page sample data will render based on all filters.
10. If we click the Home
or any value from the second-page breadcrumb, the filter values are removed in the home page based on the clicked context value.