Need a special offer?Find out if your project fits.
+
Get Free Trial
Get Free Trial
  1. API reference
  • Introduction
    • JavaScript
    Angular
    Vue
    React
    Other integrations
    1. Available tutorials
      2. Integration with Blazor
      1. Sample Blazor project
      2. Integration with Blazor
      3. The FlexmonsterComponent
      4. Using methods and events
      5. Accessing Flexmonster functionality through JavaScript
      Integration with Python
    2. Integration with React Native
    3. Integration with TypeScript
    4. Integration with R Shiny
    5. Integration with Ionic
    6. Integration with Electron.js
    7. Integration with Flutter
    8. Integration with jQuery
    9. Integration with Webpack
    10. Integration with RequireJS
    Troubleshooting
    Connecting to Data Source
    Configuring the component
    Saving component configs
    Customizing
    Charts
    License keys
    Accessibility
    Security
    Updating to the latest version
    Flexmonster CLI Reference
  • Browser compatibility
  • Documentation for older versions
    • Table of contents

    The FlexmonsterComponent

    The FlexmonsterComponent embeds Flexmonster into a Blazor application.

    The simplest component usage

    To add an empty pivot table, specify the <FlexmonsterComponent/> tag without any parameters:

    <FlexmonsterComponent/>

    Learn more about integration with Blazor.

    Available parameters

    The FlexmonsterComponent’s parameters are equivalent to Flexmonster’s parameters, but with certain differences:

    • The FlexmonsterComponent does not support the following parameters:
      • customizeAPIRequest
      • customizeCell
      • customizeChartElement
      • customizeContextMenu
    • The FlexmonsterComponent has the JavaScriptHandler parameter, which is not available in the new Flexmonster() API call.
      With the JavaScriptHandler, you can use JavaScript to access Flexmonster features that are not supported in Blazor out of the box (e.g., Toolbar customization).
      See how to access Flexmonster functionality through JavaScript.

    Setting the FlexmonsterComponent's parameters

    Parameters can be set as hardcoded values or as variables:

    Hardcoded value

    Enclose the value in double quotes (""):

    <FlexmonsterComponent Report="https://cdn.flexmonster.com/reports/report.json"/>

    Variable

    Enclose the variable's name in double quotes ("") and add the @ prefix to it:

    <FlexmonsterComponent Report="@report"/>

    The specified variable (in our case, the report) should be defined in the @code section of the component.

    Learn more about component parameters in Blazor.

    See also