DHTMLX Docs & Samples Explorer

Math in Grid

Math Extension

dhtmlxgrid_math.js required

Math Formulas with Script

The user can attach the necessary math formula to a column while defining its type with setColTypes() method. [=…] should be used to set formula to the necessary column. At the same time, the user still uses any of available eXcells to format the result:


In the example above, c2*c3 means that the value of the last column should be equal to the product of column 2 value and column 3 value. Column indexes are zero-based. The user may apply any JavaScript math operators as long as he refers to correct columns (existing columns with numeric values).

Math Formulas with XML

To set a formula for a single cell, the user can define it directly in XML as a cell value, starting expression with ”=”. Column type should still be defined with Math formula (see above), or as type “math”.


Rounding Resulting Values

Together with Math formulas, the user may need to use the following grid method to round resulting values:

        grid.setMathRound(decimal_places); // decimal_places - number of digits after the point

Editing Formulas in Grid

By default, all cells with formulas are read-only, thus, the user can't change the formula on the fly. But he still can enable formula editing using the following method:


The parameter state can be either false (by default) meaning that all formula cells are read-only, or to true - all formula cells are made editable.

Automatically Calculated Values for Header/Footer

Starting from v1.5, it became quite easy to add automatically calculated values to grid footer or header. Here is the list of available types:

  • stat_total - calculates the sum of all values in the column;
  • stat_multi_total - calculates multiplication of two cells sum (cell indexes for multiplication should be passed as arguments: {#stat_multi_total}1:2, where 1 and 2 are indexes of columns to get values from);
  • stat_max - shows maximal value in the column;
  • stat_min - shows minimal value in the column;
  • stat_average - shows simple average of column values;
  • stat_count - counts number of rows in the grid.

To activate this functionality, the user should include dhtmlxgrid_filter.js into the page and use names listed above with prefix (#) as header/footer cell content. Any HTML can also be added to it, like:

  <b>Total:</b> {#stat_total}

Note: Only one type of an auto-calculated value can be used in a single cell.

If automatically calculated values were added after grid's initialization, the user can force recalculation using the following command:


Custom Statistics Counters