Options

Options define the configuration of a control’s user interface and its functionality. This guide will show how to set some options for specific use cases.

Options are divided into two subgroups:

See the structure of the options for each control.

Layout options

Layout options define how data and interface elements are arranged and displayed within the grid.

Change the default view of the Flexmonster control

By default, after initialization of the Flexmonster control, it displays a pivot view. You can switch to a flat table by specifying the viewType option:

const flexmonster = fm3.Controls.Flexmonster("#container", {
  state,
  options: {
    viewType: "flat"
  }
});

To switch back to the pivot table, remove the viewType option or set it to "pivot".

Set headers visibility

To hide the spreadsheet headers with column and row numbers of the grid, set the showSheetHeaders option to false:

Show totals

By default, the total row in the flat table is hidden. To show totals, set the totalRowPosition option to "before" or "after", depending on the necessary total row position. Example:

Change the position of totals

The total row in the flat table can be displayed at the top or at the bottom of the grid. Choose the position of totals by setting the totalRowPosition option to "before" (top) or "after" (bottom). Example:

Functionality options

Functionality options control which features and interactive elements are available to users.

Set search visibility for the field list

To hide the search bar in the field list, set the showSearch option to false:

Related option objects

Each control in Flexmonster has its own options object that defines the configuration properties available for customization.

Below are the option objects used by each control: