Previewing Reports in ASP.NET
The CrystalReportViewer control is the interface for previewing reports in an ASP.NET application. Adding a viewer control to a web page is as simple as dragging the control from the Toolbox onto the web page. After it is added to an ASP.NET page, it is represented by a simple rectangle.
Figure 3-5. The viewer control as positioned on an ASP.NET page.
If you previously worked through the Windows example where you added the viewer control to a form, you will now notice that the ASP.NET viewer looks different than the Windows viewer. When you add the viewer to an ASP.NET page, it only displays a simple rectangle. It doesn’t show you a template of what the viewer looks like. However, once you attach a report to the viewer, it will show you a mock-up of what the final report looks like on the web page.
Although the viewer control is very small when you add it to the web page, when you run the application it automatically grows to fill the remainder of the web page. It expands horizontally across the page as well as vertically down the page. This ensures that the report is readable when the page is displayed.This is controlled by the BestFitPage property (default value of True). If you set this property to False, the viewer control will not resize itself and the report will be displayed within the bounds of the viewer. Setting it to False is useful when you want to limit the amount of space on the web page that is allocated to viewing reports. Obviously, if you decide to set BestFitPage to False, you should resize the viewer to make it large enough to comfortably display your report.
When BestFitPage property is True, the control does not expand upward. It only expands downward and across. Any information above the viewer control remains intact and properly formatted. This makes it an ideal location to put your own controls because you know that they won’t be overwritten by the report.
If the Page Layout is set to FlowLayout, all information below the viewer will be pushed down the page so that it appears after the viewer control. If the Page Layout is set to GridLayout, the information after the viewer control will not be pushed down. The ASP.NET controls will overlap the viewer control. This could either make for a very messy report or you could get creative and implement some interesting formatting effects.
As you can see in Figure 3-6, when the viewer is displayed in an ASP.NET page, it looks very similar to the report preview that you’ve seen with Windows applications.
Figure 3-6. The report preview in an Internet Explorer browser.
Question: I want to have the viewer to have the same look and feel of my website. How to customize the formatting of the viewer
Answer: The viewer control is formatted using a cascading style sheet. If you look at the HTML source for the web page, you’ll see the reference to the file default.css. If you want to modify it, the HTML source show you the full file path to the default.css file. You can either modify it directly, or make a copy of it, rename it, and modify the copy. The viewer has a property called CSSFilename that you should change so that it points to the new .css file. The report viewer also supports ASP.NET themes.
Question: I want to show multiple reports within one viewer control and have a separate tab for each one. How do I do that?
Answer: The viewer control can only preview one report at a time. It doesn’t support multiple tabs with a different report on each tab. As a trick, you can use the ASP.NET MultiView control on your form and place multiple View controls within it. Each View control can have one report viewer on it. For example, if you wanted to show three reports on a single web page, you would have three View controls on it and each view control would preview a different report. You can add buttons to the web page to navigate between the different reports.
