The following example demonstrates how to apply master filtering in ASPxDashboard on the client side when the dashboard is connected to an OLAP cube.
In this example, the ASPxClientDashboard.SetMasterFilter method is used to select required cards in the Card dashboard item. This method is called in the onClick event handler of the dxButton.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs"
Inherits="ASPxDashboard_SetMasterFilter_Olap.Default" %>
<%@ Register Assembly="DevExpress.Dashboard.v16.2.Web, Version=16.2.5.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="setMasterFilterButton" style="float: left; margin-left: 150px;"></div>
<div id="clearMasterFilterButton" style="float: left; margin-left: 150px;"></div>
<div style="position: absolute; left: 0; right: 0; top:50px; bottom:0;">
<dx:ASPxDashboard ID="ASPxDashboard1" runat="server"
WorkingMode="Viewer"
ClientInstanceName="webDashboard"
ClientSideEvents-Init="function() { initializeFilters(); }"
Width="100%" Height="100%"></dx:ASPxDashboard>
</div>
</form>
</body>
</html>
<script type="text/javascript" src="<%= Page.ResolveClientUrl("~/Scripts/MasterFiltering.js") %>"></script>
using System;
namespace ASPxDashboard_SetMasterFilter_Olap
{
public partial class Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
ASPxDashboard1.DashboardXmlPath = Server.MapPath("App_Data/dashboard1.xml");
}
}
}
function initializeFilters() {
function applyFilters() {
var orderDateQ42001 = ['[Date].[Calendar Year].&[2001]', '[Date].[Calendar Quarter of Year].&[CY Q4]'];
var orderDateQ12002 = ['[Date].[Calendar Year].&[2002]', '[Date].[Calendar Quarter of Year].&[CY Q1]'];
if (webDashboard.CanSetMasterFilter("cardDashboardItem1")) {
webDashboard.SetMasterFilter("cardDashboardItem1", [orderDateQ42001, orderDateQ12002]);
}
}
function clearFilters() {
if (webDashboard.CanClearMasterFilter("cardDashboardItem1")) {
webDashboard.ClearMasterFilter("cardDashboardItem1");
}
}
$("#setMasterFilterButton").dxButton({
text: "Apply Filter",
onClick: applyFilters
});
$("#clearMasterFilterButton").dxButton({
text: "Clear Filter",
onClick: clearFilters
});
};
function initializeFilters() {
function applyFilters() {
var orderDateQ42001 = ['[Date].[Calendar Year].&[2001]', '[Date].[Calendar Quarter of Year].&[CY Q4]'];
var orderDateQ12002 = ['[Date].[Calendar Year].&[2002]', '[Date].[Calendar Quarter of Year].&[CY Q1]'];
if (webDashboard.CanSetMasterFilter("cardDashboardItem1")) {
webDashboard.SetMasterFilter("cardDashboardItem1", [orderDateQ42001, orderDateQ12002]);
}
}
function clearFilters() {
if (webDashboard.CanClearMasterFilter("cardDashboardItem1")) {
webDashboard.ClearMasterFilter("cardDashboardItem1");
}
}
$("#setMasterFilterButton").dxButton({
text: "Apply Filter",
onClick: applyFilters
});
$("#clearMasterFilterButton").dxButton({
text: "Clear Filter",
onClick: clearFilters
});
};
Imports System
Namespace ASPxDashboard_SetMasterFilter_Olap
Partial Public Class [Default]
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
ASPxDashboard1.DashboardXmlPath = Server.MapPath("App_Data/dashboard1.xml")
End Sub
End Class
End Namespace
<%@ Page Language="vb" AutoEventWireup="true" CodeBehind="Default.aspx.vb"
Inherits="ASPxDashboard_SetMasterFilter_Olap.Default" %>
<%@ Register Assembly="DevExpress.Dashboard.v16.2.Web, Version=16.2.5.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="setMasterFilterButton" style="float: left; margin-left: 150px;"></div>
<div id="clearMasterFilterButton" style="float: left; margin-left: 150px;"></div>
<div style="position: absolute; left: 0; right: 0; top:50px; bottom:0;">
<dx:ASPxDashboard ID="ASPxDashboard1" runat="server"
WorkingMode="Viewer"
ClientInstanceName="webDashboard"
ClientSideEvents-Init="function() { initializeFilters(); }"
Width="100%" Height="100%"></dx:ASPxDashboard>
</div>
</form>
</body>
</html>
<script type="text/javascript" src="<%=Page.ResolveClientUrl("~/Scripts/MasterFiltering.js")%>"></script>