# JSViewer MVC

This topic demonstrates the use of the ActiveReports JSViewer with an ASP.NET MVC 5 back-end.

## Content

The JSViewer\_MVC sample demonstrates the use of the ActiveReports JSViewer with an ASP.NET MVC 5 back-end.
![Screenshot 2025-06-13 130847](https://cdn.mescius.io/document-site-files/images/b298aea2-8cb8-4a0f-be88-4f54aa263ebd/Screenshot%202025-06-13%20130847.6fd5ce.png?width=1235)

### Sample Location

[https://github.com/activereports/WebSamples20/tree/main/JSViewer_MVC](https://github.com/activereports/WebSamples19/tree/main/JSViewer_MVC)

### Details

When you run the sample, the default page appears in your browser. This page provides links to reports that demonstrate the use of the ActiveReports JSViewer with an ASP.NET MVC 5 back end.
Clicking the report link in the left panel opens the report for preview. You can preview the following reports.

* AnnualReport.rdlx
* Invoice.rdlx
* Invoice.rpx
* Invoice\_Colored.rpx
* InvoiceList.rdlx
* Project & Resource Analysis - Staff Performance Analysis.rdlx
* User defined report columns.rdlx
* Statistical analysis scatter plot.rdlx

The project consists of the following elements.

* Controllers folder: This folder contains the **HomeController** that handles the user interaction and returns the main Index view.
* ViewerApp folder: Contains JSViewer CSS and JavaScript files.
* Global.asax: The default class that sets global URL routing values for this web application.
* packages.config
* Startup.cs: This is the default startup file.
* Web.config: This configuration file contains the httpHandlers that allow ActiveReports to process reports on the Web. Note that you need to manually update version information here when you update your version of ActiveReports.

>type=warning
> Before publishing the sample, you must copy the sample **ViewerApp** folder to the **publish** folder.