Web Dashboards - Neutral Filter Mode - Feedback Wanted!

Data filtering is one of the most-used interactive features of our Dashboard suite. We have recently taken some time to analyze the current implementation as well as user interaction patterns for the functionality. We observed two common behaviors:

  1. Our filtering widgets show all items selected by default, to indicate that no filtering is currently taking place: everything is included. Starting from this state, users typically begin each filtering operation by deselecting All, before they select individual items.
  2. Many scenarios require filtering by more than one criteria, and in this case multiple filtering widgets are usually used sequentially. For instance, a user might first filter by a Category, then by a Product, then perhaps by a time-related criteria or similar.

Room for improvement

On the basis of this understanding of common scenarios, we found that there are three technical issues with the current implementation. The first one is obvious: an extra click is required to begin any actual filtering operation, because the standard representation of the everything included state shows all items selected. You might call this a usability problem rather than a technical one, but we made the technical choice of presenting everything included this way in the first place!

The second issue is invisible but potentially important: internally, an everything included state still generates filtering criteria that are evaluated by the data layer and/or the database. This is not an optimal implementation for performance reasons.

The third problem is that there is a potential “dead lock” situation for the user, due to the fact that multiple filtering widgets influence each other. See the steps illustrated in the image below:

  1. The user deselects the year 1998 in filtering widget 1. The month/year combo items in filtering widget 2 are filtered down to exclude that year.
  2. Filtering widget 2 is used to select some individual month/year combo items for 1996 and 1997. Filtering widget 1 is filtered down to show only these two years.
  3. At this point it becomes impossible to bring 1998 back up for inclusion, because both widgets have criteria applied that exclude 1998.

Filtering deadlock

Neutral Filter Mode

To solve all the above problems, we have create a new filter mode called Neutral Filter Mode. It is neutral in the sense that it does not apply any criteria to the data source in its everything included state. This solves the second technical issue explained above, resulting in improved performance.

In the new mode, filtering widgets display the everything included state by showing all items deselected. This means that an extra click is no longer required in the most common scenarios, and this behavior is familiar to end users from websites world-wide. At the same time we have slight concerns about this change, since it requires user behavior to change as well.

Finally, the “dead lock” situation described above can be resolved with the help of a new Clear Filter button. Compare Step 3 of this illustration to the one above:

Neutral Filter Mode

Give it a try!

In our minor release v18.1.5, the Neutral Filter Mode is available as a CTP feature for Web dashboards. We intend to support it for WinForms and WPF dashboards soon, and the feature will be fully released with v18.2.

To activate the mode, use the client-side property dashboardControl._useNeutralFilterMode:

<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Main.Master" CodeBehind="Default.aspx.cs" Inherits="DXWebApplication1.Default" %>
<%@ Register Assembly="DevExpress.Dashboard.v18.1.Web.WebForms, Version=18.1.5.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" Namespace="DevExpress.DashboardWeb" TagPrefix="dx"%>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
  <script type="text/javascript">
    function onBeforeRender(sender) {
      var control = sender.GetDashboardControl();
      control._useNeutralFilterMode = true;
    }
  </script>
  <dx:ASPxDashboard ID="ASPxDashboard1" runat="server" Width="100%" Height="100%" OnDataLoading="DataLoading">
    <ClientSideEvents BeforeRender="onBeforeRender" />
  </dx:ASPxDashboard>
</asp:Content>

A demo of the new mode is available here: Neutral Filter Mode

Your feedback is appreciated

We hope you will share any thoughts with us! The new filter mode changes the user experience, and its internal implementation is also quite different from the old mode due to the way filtering criteria are applied. We want to use the time until the v18.2 release to finalize this feature, or revise it if necessary. We appreciate any thoughts you post to the comments section below, but it would also help us if you could answer the question in this short survey:

2 comment(s)

We will upgrate in next  month , i loved the new improvement

1 August, 2018

Great that you have improved this component that is very valuable in the dashboards. Thank you Team of DevExpress. I will upgrade to 18.1.5 now to see this new mode.

1 August, 2018

Please login or register to post comments.