Add a New Report to an ASP.NET MVC Application

This tutorial describes how to add a new report to an ASP.NET MVC application at design time within Visual Studio.

Tip

See Manual Integration of ASP.NET MVC Reporting Extensions Into an Existing Project to learn how to add a reporting functionality to an existing MCV application.

Creating a New Application

Do the following to create a new ASP.NET MVC application in Microsoft® Visual Studio® 2010, 2012, 2013, 2015 or 2017:

  1. Create a new project by selecting FILE | New | Project… in the main menu or by pressing CTRL+SHIFT+N.

    create-new-application-windows-forms

  2. In the invoked New Project dialog, expand the Installed category, select a programming language (Visual C# or Visual Basic) in the Templates section and select the DevExpress v18.1 Template Gallery.

    asp-net-mvc-reports-create-devexpress-template-gallery

    Specify the application name and click OK.

  3. In the invoked DevExpress Template Gallery, select Web Application under the ASP.NET MVC category and click Run Wizard.

    Tip

    You can also select Reporting Web Application to create an application containing the HTML5 Document Viewer and/or Report Designer controls. See the following documents for detailed instructions:

    asp-net-devexpress-template-gallery-web-application

  4. On the DevExpress ASP.NET MVC Project Wizard's Choose Layout page, select the application layout (for example, Standard).

    asp-net-devexpress-project-wizard-create-standard

  5. Switch to the MVC Settings page and specify the MVC version.

    asp-net-mvc-devexpress-project-wizard-version

  6. Switch to the Suites page, enable the Report suite and click Create Project.

    asp-net-mvc-devexpress-project-wizard-suite

Add a Report to the MVC Application

Do the following to add a report to your ASP.NET MVC application:

  1. Start by creating a new folder (named Reports) to store the application's reports. Switch to the Solution Explorer window (by pressing CTRL+ALT+L), right-click the application item and select Add | New Folder.

    asp-net-mvc-add-new-folder

  2. Right-click the created folder and choose Add DevExpress Item | New Item... in the invoked menu.

    asp-net-mvc-add-new-xtrareport

  3. In the invoked DevExpress Template Gallery, select XtraReport Wizard Web, specify the report name and click Add Item.

    asp-net-mvc-devexpress-template-gallery-add-item-xtrareport

    This invokes the Report Wizard where you can choose to create a blank or data-bound report.

    xtrareport-wizard-empty-report-01

 

Next Step: Create a Simple Data-Aware Report