Quick Start with SharpShooter Reports.Web using NuGet (ASP.NET Web Application)

Table of Contents

System Requirements
Introduction
Implementation
Step 1. Add SharpShooter Reports.Web package to your project
Step 2. Add the Report Viewer to a Page
Step 3. Run the Project
Step 4. Edit the Report

System Requirements

In order to successfully use SharpShooter Reports.WebViewer in ASP.NET Web applications you will need: 
  • .NET Framework 3.5 or higher
  • Visual Studio 2008 or higher

Introduction

This document describes how to add SharpShooter Reports.Web reporting functionality into your ASP.NET Web Application. We imply that you already have a ready ASP.NET Web Application and need to add reporting functionality there.

Also we imply that you already have NuGet extension installed in your Visual Studio. If you don’t have it please install the extension as described here.

Following this tutorial, you will be able to configure a service and add a report viewer with predefined skin into your web-application in 10 minutes using the NuGet package.

Implementation

Step 1. Add SharpShooter Reports.Web package to your project

Open the context menu of your project and select the "Manage NuGet Packages…" option.


 
Select the Online option on the left sidebar and enter SharpShooter.Reports in the search string.

Select SharpShooter Reports.Web (ASP.NET Web) from the available packages and press the Install button.


 
This package will add the following items to your project:
  • JavaScript files to /Scripts/SharpShooterReports
  • Report service classes to /SharpShooterReports
  • ASCX component to /SharpShooterReportViewer
  • Images and CSS to /Styles/SharpShooterReports
You can easily move these files wherever you need, but don’t forget to change the corresponding links and namespaces in the code.

Step 2. Add the Report Viewer to a Page

Open a page where the report viewer will be located or add a new ASPX page to the project using Master Page.

Register ReportViewer on this page by adding the following code:

<%@ Register TagPrefix="SharpShooterReports" TagName="ReportViewer" Src="~/SharpShooterReportViewer/SharpShooterReportViewer.ascx" %>

Add the styles for ReportViewer:
<link href="/Styles/SharpShooterReports/ReportViewer.css" rel="stylesheet" type="text/css" />
<link href="/Styles/SharpShooterReports/WebViewerSkin.css" rel="stylesheet" type="text/css" />
Add the ReportViewer control to the page:

<SharpShooterReports:ReportViewer runat="server"/>

The page code will looks as follows:
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"
    CodeBehind="Reports.aspx.cs" Inherits="WebApplication1.Reports" %>

<%@ Register TagPrefix="SharpShooterReports" TagName="ReportViewer" Src="~/SharpShooterReportViewer/SharpShooterReportViewer.ascx" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <link href="/Styles/SharpShooterReports/ReportViewer.css" rel="stylesheet" type="text/css" />
    <link href="/Styles/SharpShooterReports/WebViewerSkin.css" rel="stylesheet" type="text/css" />
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <SharpShooterReports:ReportViewer runat="server" />
</asp:Content>

Step 3. Run the Project

Select the ‘View in Browser’ from the context menu of the page. 


 
You will see the following scaffold report on your page:


 

Step 4. Edit the Report

In order to edit report, find /SharpShooterReports/SharpShooterReportsServiceClass.cs, and select ‘View Designer’ from the context menu. You will see something like this:


 
Double click the ReportManager 1 component, select the ‘Inline Report Slot’ item and press the ‘Run Designer’ button.


 
The report designer will be opened and you will be able to edit the report according to the the documentation.

If you have any questions regarding the integration of SharpShooter Reports.Web don’t hesitate to contact us.

Add Feedback