Get Free Trial

Integration with ASP.NET

NOTE: integration with ASP.NET is outdated and may not work with newer versions of Flexmonster.
We recommend using pure JavaScript or Flexmonster integrations with other frameworks.

This tutorial will help you integrate the pivot table with ASP.NET. A sample project is available on GitHub. Follow these steps to set up a simple ASP.NET project in Visual Studio using Flexmonster Pivot:

Step 1. Create an ASP.NET MVC project

  1. Open Visual Studio. If you don’t have it installed, we recommend Visual Studio 2015.
  2. Click File.
  3. Choose New -> Project.
  4. Choose Web.
  5. Enter the project name and click OK.
  6. Select an Empty template, add MVC references, and click OK.

Step 2. Add a View and a Controller

  1. Choose Controllers -> Add -> Controller.
  2. Choose MVC Controller – Empty and click OK.
  3. Enter a name, e.g. PivotController.
  4. Choose Views/Pivot -> Add -> View.
  5. Enter a name, e.g. Index.
  6. In Visual Studio choose Debug -> Start Without Debugging. You will see an empty project.

Step 3. Add Flexmonster.Mvc.dll

  1. Copy Flexmonster.Mvc.dll to your project folder.
  2. Choose References -> Add reference.
  3. Choose Browse and click the ‘Browse’ button.
  4. Inside file explorer find and select Flexmonster.Mvc.dll from your project folder.
  5. Make sure you selected the file and click OK.
  6. Open the web.config file from the Views/ folder. Find the following code:
            <add namespace="System.Web.Mvc" />
            <add namespace="System.Web.Mvc.Ajax" />
            <add namespace="System.Web.Mvc.Html" />
            <add namespace="System.Web.Routing" />
            <add namespace="WebApplication1" />

    and add this line inside:

    <add namespace="Flexmonster.Mvc" />

Step 4. Add Flexmonster js files to the Scripts folder

Copy the flexmonster/ folder from the download package to the scripts/ folder.

Step 5. Add a pivot table

Change the content of Index.cshtml in Views/Pivot/. Note that licenseKey is your license or trial key, so replace XXXX-XXXX-XXXX-XXXX-XXXX  with an actual key.

    ViewBag.Title = "Index";


<script src="~/Scripts/flexmonster/flexmonster.js"></script>
@Html.Flexmonster("pivot").Init(new Flexmonster.Mvc.Config()
    componentFolder = "/Scripts/flexmonster/",
    licenseKey = "XXXX-XXXX-XXXX-XXXX-XXXX",
    toolbar = true,
    report = ""

Step 6. Build and run

Now the project is ready to run. In Visual Studio choose Debug -> Start Without Debugging.

You will see a pivot table with a sample report loaded.

You can download the full example here.