Show/Hide Toolbars

Navigation: Using ASPRunnerPro > Dashboards

ASPrunnerPro32x32     ASPRunnerPro manual


Creating dashboards

Scroll Prev Next More

 

Dashboards allow you to display multiple related or unrelated objects on the same page like grids, single record views, master and details together, charts, reports, search pages etc.

An example of dashboard with Orders table, along with details (Order Details and Customers) and single Orders table record view:

dashboard_ex

Creating a new dashboard

To create a dashboard:

1. Proceed to the Datasource tables page and click Create Dashboard.

2. Enter the dashboard name. Click OK.

dashboard_create

yellowbulbNote: It is possible to create a copy of the existing dashboard (right-click the dashboard and select Copy).

On the next several pages (use Next button to navigate) you can:

set dashboard layout;

define your dashboard's search settings.

Customize dashboard layout

On the Dashboard layout screen you may select dashboard elements and define your dashboard's layout. You may change the layout of your dashboard using merge and split buttons.

Clicking add allows you to select a data grid, single record view, chart, report or search page to use as a dashboard element.

dashboard_add

Click settings on the added dashboard element to customize its appearance. Click remove to delete it.
 

dashboard_settings

Code snippets in dashboards

You can insert any sort of code snippet as a dashboard element. This code could be used to display current weather, calculate order totals, show the number of active users or even embed a Youtube video.
See this live demo for inspiration.
 

Master-details dashboard

You can select grid features to be displayed in a browser: Add/Edit/View/Delete record buttons for a data grid, View/Add/Edit tabs for a single record. Use the Filter by master table option to make dashboard elements display data depending on other dashboard elements. You can use this option for cascading master-details (for example, customers-orders-order details) or when a map is used as details.

dashboard_grid_settings

If a dashboard element has a strongly differing width or height, you may use the Taller/Shorter and Wider/Narrower buttons to change the cells' dimensions. In the example below, we make the orders-record element shorter.

dashboard_taller_shorter

How it looks in a browser:

dashboard_taller_shorter_ex

Dashboard with data grid and single record view

To create a dashboard in which a selection in a data grid updates the single record view:

1. Add two tables to a dashboard: one to use as a data grid and one as a single record.

dashboard_grid_single_record

2. Click settings on the grid element and select grid features to be displayed in a browser (Add/Edit/View/Delete record buttons).

3. Click settings on the record element and select tabs to be displayed on the single record view (View/Add/Edit tabs).

Dashboard page in a browser:

dashboard_grid_single_record_ex

Dashboard with map and single record view

After you add the map to the dashboard and click on one of markers on the map in a browser it will be highlighted.
If you need to see the record's data in a fashion similar to the View page after clicking on the marker you need to also add a single record of the table that is used as the map source.
 
To create a dashboard, where clicking on a map marker updates the single record view:

1. Add two tables to a dashboard: one to use as a map and one as a single record.

dash_map_singlerecord

2. Click settings on the map element and select Latitude and Longitude fields.

dashboard_grid_map_settings

3. Click settings on the record element and select tabs to be displayed on the single record view (View/Add/Edit tabs).

Dashboard page in a browser:

dash_map_single_br

 
Dashboard with data grid and map

There are two different primary uses for a map. A map can serve as master, allowing you to zoom in into any area on the map, and the related grid will only show records in the specified region. In other words, you may use map a to filter grid contents. In second mode the map simply shows all the same records that appear in the grid.
 

To create a dashboard where grid data is updated when you change the zoom level of the map:

1. Add two tables to a dashboard: one to use as a map and one as a data grid. Note that you need to use Latitude and Longitude fields to make the map function properly.

dashboard_grid_map

2. Click settings on the grid element and select grid features to be displayed in a browser (Add/Edit/View/Delete record buttons).

3. Click settings on the map element and select Latitude and Longitude fields. Select Use map to filter grid data option.

dashboard_grid_map_settings

Click Global map settings to select map provider. Enter API Key (if required).
You can obtain API keys for development purposes for free at https://developers.google.com (for Google maps) or at bingmapsportal.com (for Bing maps).

map_settings

You may use the Geocoding option to update latitude/longitude information each time a record is added or updated. You may either select existing fields for storing latitude and longitude data or create new ones. Then select address field(s) to be used during geocoding.

geocoding_set

Dashboard page in a browser:

dashboard_grid_map_ex