Server-Side Row Model - Grid Filter

Summary

The Grid Filter needs to be evaluated remotely when using the Server-Side Row Model
AdapTable provides the current Grid Filter Expression and AST so you can pass them to the server
Custom Expression Functions and Named Queries work the same way — only the evaluation is remote

When using the Server-Side Row Model, AG Grid will not perform any filtering.

The Grid Filter can still be applied, but instead of AdapTableQL evaluating the Expression automatically, it is performed by developers on the server.

Hint

The Grid Filter can also include Custom Expression Functions provided by developers
These will also then need to be evaluated remotely in a bespoke implementation

Find Out More

Column Filtering covers Column Filters, In Filter values, and how to retrieve Filter State via getAdaptableFilterState

Getting Filter State

Inside getRows, send the current Grid Filter to the server using getAdaptableFilterState in the State API.

The returned AdaptableFilterState includes gridFilter (the Expression string) and gridFilterAST (the AST to evaluate remotely).

Note

The Grid Filter Applied Event still fires, but is rarely subscribed to when using the SSRM

Limiting Expression Complexity

By default AdapTable will provide every AdapTableQL Expression Functions in the Expression Editor.

This means bespoke server implementations will need to translate every Expression into something meaningful.

Accordingly, AdapTable allows developers to reduce Expression complexity in 2 ways in order to make the server implementation more manageable:

Limiting which Expressions are available (on a per Module basis if required)
Limiting which Columns can be included in a Query / Expression

SSRM - Grid Filter

Fork Fork

The example shows how the AdapTable Grid Filter can still be used while using Server-Side Row Model
We include 3 Named Queries which are evaluated on our mock server (and accessible from dropdown at end of toolbar):
- US Golds - returns rows where USA has > 1 gold
- European Athletes - returns rows where country is in Europe (and uses a Custom Boolean Expression Function, FROM_EUROPE, that is also evaluated on our mock server)
- 5 Medals - returns rows where Gold + Silver + Bronze is greater than 5
We provide an implementation of isExpressionFunctionAvailable in Expression Options to show how to limit which Grid Filter expression functions are available

Try It Out

Apply the 3 Named Queries from the Grid Filter toolbar (or write your own) and note the SQL sent to the server

import {
  AdaptableOptions,
  GlobalExpressionFunctionAvailabilityContext,
} from '@adaptabletools/adaptable';

const gridFilterFunctions = [
  'EQ',
  'NEQ',
  'GT',
  'LT',
  'GTE',
  'LTE',
  'AND',
  'OR',
  'NOT',
  'IN',
  'NOT_IN',
  'CONTAINS',
  'NOT_CONTAINS',
  'STARTS_WITH',
  'ENDS_WITH',
  'REGEX',
  'IS_BLANK',
  'IS_NOT_BLANK',
  'IS_POSITIVE',
  'IS_NEGATIVE',
  'SUM',
  'SUB',
  'PRODUCT',
  'DIV',
  'IS_TODAY',
  'IS_YESTERDAY',
  'IS_TOMORROW',
  'IS_BEFORE_TODAY',
  'IS_AFTER_TODAY',
  'IS_PAST',
  'IS_FUTURE',
  'IS_THIS_WEEK',
  'IS_THIS_MONTH',
  'IS_THIS_QUARTER',
  'IS_THIS_YEAR',
  'IS_WORKDAY',
  'IS_HOLIDAY',
  'IS_NEXT_WORKDAY',
  'IS_PREV_WORKDAY',
  'IS_SAME_DAY',
  'IS_DIFFERENT_DAY',
  'DATE',
  'TODAY',
  'CURRENT_DAY',
  'COL',
  'FROM_EUROPE',
];

export const adaptableOptions: AdaptableOptions = {
  primaryKey: 'id',
  adaptableId: 'SSRM - Grid Filtering',
  expressionOptions: {
    customStandardFunctions: {
      FROM_EUROPE: {
        // handled on the server
        handler: () => true,
        category: 'custom',
        returnType: 'boolean',
        operands: [['text']],
        description: 'Returns true if the country is from Europe',
        signatures: ['FROM_EUROPE([country])'],
        isAvailable: ['GridFilter'],
      },
    },
    isExpressionFunctionAvailable: (
      context: GlobalExpressionFunctionAvailabilityContext
    ) => {
      if (context.module === 'GridFilter') {
        return gridFilterFunctions.includes(context.functionName);
      }
      return context.defaultAvailability;
    },
  },
  initialState: {
    Dashboard: {
      Tabs: [
        {
          Name: 'Main',
          Toolbars: ['GridFilter', 'SystemStatus'],
        },
      ],
    },
    Theme: {
      CurrentTheme: 'dark',
    },
    Layout: {
      CurrentLayout: 'SSRM Layout',
      Layouts: [
        {
          Name: 'SSRM Layout',
          TableColumns: [
            'athlete',
            'gold',
            'silver',
            'bronze',
            'country',
            'sport',
            'year',
          ],
          ColumnSizing: {
            athlete: {Width: 175},
            bronze: {Width: 100},
            country: {Width: 125},
            gold: {Width: 100},
            silver: {Width: 100},
            sport: {Width: 175},
            year: {Width: 115},
          },
        },
      ],
    },
    NamedQuery: {
      NamedQueries: [
        {
          Name: 'US Golds',
          Expression: '[country]="United States" AND [gold] > 1',
        },
        {
          Name: 'European Athletes',
          Expression: 'FROM_EUROPE([country])',
        },
        {
          Name: '5 Medals',
          Expression: '[gold] + [silver] + [bronze] > 5',
        },
      ],
    },
  },
};

Read-only

Loading demo…

PreviousColumn Filtering NextExporting