1. API reference
    1. Introduction
    2. Flexmonster()
  2. Objects
    1. All objects
    2. Report Object
    3. Data Source Object
    4. Slice Object
    5. Options Object
    6. Filtering
      1. Filter Object
      2. Number Query Object
      3. String Query Object
      4. Date Query Object
      5. Time Query Object
      6. Value Query Object
    7. Format Object
    8. Conditional Format Object
    9. Cell Data Object
    10. Toolbar Object
  3. Methods
    1. All methods
    2. addCalculatedMeasure
    3. addCondition
    4. alert
    5. clear
    6. clearFilter
    7. clearXMLACache
    8. closeFieldsList
    9. collapseAllData
    10. collapseData
    11. connectTo
    12. customizeCell
    13. customizeContextMenu
    14. dispose
    15. expandAllData
    16. expandData
    17. exportTo
    18. getAllConditions
    19. getAllHierarchies
    20. getAllMeasures
    21. getCell
    22. getColumns
    23. getCondition
    24. getData
    25. getFilter
    26. getFormat
    27. getMeasures
    28. getMembers
    29. getOptions
    30. getReport
    31. getReportFilters
    32. getRows
    33. getSelectedCell
    34. getSort
    35. getXMLACatalogs
    36. getXMLACubes
    37. getXMLADataSources
    38. getXMLAProviderName
    39. load
    40. off
    41. on
    42. open
    43. openFieldsList
    44. openFilter
    45. print
    46. refresh
    47. removeAllCalculatedMeasures
    48. removeAllConditions
    49. removeCalculatedMeasure
    50. removeCondition
    51. removeSelection
    52. runQuery
    53. save
    54. setFilter
    55. setFormat
    56. setOptions
    57. setReport
    58. setSort
    59. showCharts
    60. showGrid
    61. showGridAndCharts
    62. sortingMethod
    63. sortValues
    64. updateData
  4. Events
    1. All events
    2. afterchartdraw
    3. aftergriddraw
    4. beforegriddraw
    5. beforetoolbarcreated
    6. cellclick
    7. celldoubleclick
    8. datachanged
    9. dataerror
    10. datafilecancelled
    11. dataloaded
    12. exportcomplete
    13. exportstart
    14. fieldslistclose
    15. fieldslistopen
    16. filterclose
    17. filteropen
    18. loadingdata
    19. loadinglocalization
    20. loadingolapstructure
    21. loadingreportfile
    22. localizationerror
    23. localizationloaded
    24. olapstructureerror
    25. olapstructureloaded
    26. openingreportfile
    27. printcomplete
    28. printstart
    29. querycomplete
    30. queryerror
    31. ready
    32. reportchange
    33. reportcomplete
    34. reportfilecancelled
    35. reportfileerror
    36. runningquery
    37. update
Table of contents

customizeCell

customizeCell(customizeCellFunction:Function)

[starting from version: 2.306]

This API call allows customizing of separate cells. For example, you can add links, custom styles or formatting.

Please note, you can define customizeCell in two ways:

  1. as a regular API call: flexmonster.customizeCell(customizeCellFunction);
  2. as an initialization parameter: new Flexmonster({customizeCell: customizeCellFunction, ...})

Parameters

customizeCellFunction function or null in case you do not need to change anything. Data passed to the customizeCellFunction:

  • cell (starting from v2.4) – Cell builder. The object that contains the current representation of the cell on the grid and through which the cell representation can be customized. It has the following properties and methods:
    • attr – Object. All attributes and their values for the HTML element. Custom attributes can be added to the cell and, for example, used in CSS selectors to identify the cell. Read more info about CSS attribute selectors.
    • classes – Array of strings. The array of classes assigned to the cell. addClass() method should be used to add the new class.
    • style – Object. CSS object of the element that will be put in style attribute of the element for inline styling.
    • tag – String. The tag of the element (each cell has tag: "div").
    • text – String. The text of the element which may also contain HTML, e.g. icons for expand, collapse, drill up and down, sorting, etc.
    • addClass(value: String) – Method. Use this method to add new classes to the element.
    • toHtml() – Method. Returns HTML string that represents the cell. It gathers all the properties of the cell builder object into HTML. This is how the cell will be added to the grid.
  • dataCell Data Object which contains information about the cell.

Examples

1) Alternating row colors:

function customizeCellFunction(cell, data) {
  if (data.type == "value") {
    if (data.rowIndex % 2 == 0) {
      cell.addClass("alter1");
    } else {
      cell.addClass("alter2");
    }
  }
}

"alter1" and "alter2" CSS classes are specified additionally. Check out a live sample on JSFiddle.

2) Styling subtotals and grand totals:

function customizeCellFunction(cell, data) {
  if (data.isClassicTotalRow) cell.addClass("fm-total-classic-r");
  if (data.isGrandTotalRow) cell.addClass("fm-grand-total-r");
  if (data.isGrandTotalColumn) cell.addClass("fm-grand-total-c");
}

This example has 3 different CSS classes and they are added to subtotal row in classic view, to grand total row and to grand total column. Try on JSFiddle.

3) Highlighting levels through entire grid:

function customizeCellFunction(cell, data) {
  if (data.level != undefined) {
    cell.addClass("fm-level-"+data.level);
  }
}

customizeCellFunction is used here to add different CSS classes for different levels. This live sample on JSFiddle highlights first three levels in rows.

4) Highlighting cells based on their semantics – member, hierarchy, measure:

5) Styling rows based on conditional formatting:

Demonstrates highlighting of the entire row in the pivot table if the condition of the conditional formatting is true for at least one cell in this row. Also, this sample shows how to use beforegriddraw and aftergriddraw events. Check out on JSFiddle.

6) Representing numbers by icons:

In this sample cell values are replaced with the images depending on to which interval the value belongs: high, middle, etc.

7) Adding hyperlinks:

This example illustrates how to add links to some cells. Click Clear Customizing button to remove customization and click Start Customizing to add it back.