Manage Dashboard Parameters

  • 5 min to read

Web Dashboard provides a built-in Dashboard Parameters dialog, providing the capability to change dashboard parameter values.

Standard Parameter Editor

To invoke the Dashboard Parameters dialog in the Web Dashboard, click the Parameters button (the WebDashboard_ParametersIcon icon) in the dashboard title.

Parameters_DashboardParametersDialog_Web

Select the required parameter values in the Dashboard Parameters dialog and click the Submit button to apply the changes. To reset changes to the default values, click the Reset button.

To invoke and close this dialog in code, use the ASPxClientDashboard.ShowParametersDialog/ DashboardParameterDialogExtension.show and ASPxClientDashboard.HideParametersDialog / DashboardParameterDialogExtension.hide methods, respectively.

Change Parameter Values in Code

You can change dashboard parameter values in the Web Dashboard on the client side. The Web Dashboard utilizes the DashboardControl class that provides a user interface for designing a dashboard and interacting with it. You can use its API to specify parameter settings. For Web Forms and MVC, you can use the ASPxClientDashboard class, which is a wrapper over the DashboardControl with a similar API.

ASP.NET Web Forms Dashboard Control and ASP.NET MVC Dashboard Extension

The ASPxClientDashboard.GetParameters method returns the instance of ASPxClientDashboardParameter class, that allows you to obtain the parameter type, the default parameter value, the parameter name, and so on. You can also obtain possible parameter values or specify the current parameter value. For instance, you can forcibly change a parameter value when an end user changes this value in the Dashboard Parameters dialog.

Client-side API Description
ASPxClientDashboard.GetParameters Returns dashboard parameter settings and metadata.
ASPxClientDashboardParameter.GetType Returns a parameter type.
ASPxClientDashboardParameter.GetDefaultValue Returns a default parameter value.
ASPxClientDashboardParameter.GetName Returns a parameter name.
ASPxClientDashboardParameter.GetValues Returns possible parameter values.
ASPxClientDashboardParameter.SetValue(value) Specifies the current parameter value(s).
ASPxDashboard.CustomParameters Occurs before data is loaded from the data store and allows you to change parameter values before they are passed to a data query.

This example demonstrates how to change dashboard parameter values in the ASPxDashboard control on the client side using the ASPxClientDashboard.GetParameters method.

In this example, parameter values are specified using the ASPxClientDashboardParameter.SetValue method. The ASPxClientDashboard.ShowParametersDialog method is used to invoke the Dashboard Parameters dialog that displays applied parameter values.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" 
    Inherits="ASPxDashboard_SetParameterValues.Default" %>

<%@ Register Assembly="DevExpress.Dashboard.v17.1.Web, Version=17.1.2.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" 
    Namespace="DevExpress.DashboardWeb" TagPrefix="dx" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div id="setParameterValuesButton" style="float: left; margin-left: 150px;"></div>
    <div id="showParametersForm" style="float: left; margin-left: 100px;"></div>

    <div style="position: absolute; left: 0; right: 0; top:50px; bottom:0;">
        <dx:ASPxDashboard ID="ASPxDashboard1" runat="server" 
            WorkingMode="Viewer" 
            ClientInstanceName="webViewer"
            ClientSideEvents-DashboardEndUpdate="function() { setParameterValues(); }"
            Width="100%" Height="100%">
        </dx:ASPxDashboard>
    </div>
    </form>
</body>
</html>
<script type="text/javascript" src="<%= Page.ResolveClientUrl("~/Scripts/ParameterValues.js") %>"></script>

ASP.NET Core Dashboard and HTML JavaScript Dashboard Controls

The DashboardParameterDialogExtension.getParameters method returns the instance of DashboardParameterCollection class that is a collection of dashboard parameters (xref:js-DevExpress.Dashboard.DashboardParameter). You can obtain the parameter type, the default parameter value, the parameter name, and so on. You can also obtain possible parameter values or specify the current parameter value. For instance, you can forcibly change a parameter value when an end user changes this value in the Dashboard Parameters dialog.

Client-side API Description
DashboardParameterDialogExtension.getParameters Returns dashboard parameter settings and metadata.
DashboardParameterCollection.getParameterList Returns an array of dashboard parameters from the DashboardParameterCollection.
DashboardParameterCollection.getParameterByIndex Returns a dashboard parameter by its index in the DashboardParameterCollection.
DashboardParameterCollection.getParameterByName Returns a dashboard parameter by its name.
DashboardParameter.getDefaultValue Returns a default parameter value.
DashboardParameter.getName Returns a parameter name.
DashboardParameterDialogExtension.getParameters Returns dashboard parameter settings and metadata.
DashboardParameter.getType Returns a parameter type.
DashboardParameter.getValue Returns a current parameter value(s).
DashboardParameter.setValue(value) Specifies the current parameter value(s).

Manage Parameters in the Dashboard State

DashboardState stores changes resulting from end user interaction - selected master filter values, drill-down levels, selected dashboard item layers and current parameter values. A DashboardState.Parameters provides access to states of dashboard parameters.

See the following topics for more information:

See Also