View Reports on the Go with FlexViewer for ASP.NET MVC

View reports anywhere with FlexViewer Mobile for ASP.NET MVC, a highly responsive HTML5-based mobile report viewer. As part of FlexViewer, ComponentOne's cross-platform .NET report and document viewer, FlexViewer Mobile allows you to display C1Report, FlexReports, and SSRS Reports in the viewer. You can render and view reports in your ASP.NET MVC apps on any handheld device: the responsive viewer adapts to your device's display to give you the best view of your reports.

FlexViewer Mobile's multiple navigation tools make it easy for you and your users to navigate through reports. Let's take a look at how to move through pages, change the layout, and more with these tools.

Mobile Toolbar Options

The Mobile Toolbar across the top of the viewer includes commands for basic operations on whatever report is currently being shown in the viewer.

Users can go to the report's next page or its previous page using the up and down arrows on the left of the toolbar (the Previous Page/Next Page element). If users want to jump to a specific page in the report, they can type the page number in the text box next to the Previous and Next Page arrows.

Clicking on the eye icon on the toolbar displays the viewer's layout options: Single Page View (fits the width of the page based on the viewer's dimensions), Continuous Page View (shows the report with continuous scrolling through pages), Fit Whole Page (shows the entire page in the viewer's current dimensions), and Fit Page Width (fits the width of the page based on the viewer's dimensions).

Search for specific text in a report by clicking on the Show Search Bar button (the magnifying glass), which causes a search bar to appear at the bottom of the viewer.

The toolbar's rightmost icon is the Full Screen element, which — of course — displays the report in full screen mode.

Sidebar Options

The sidebar options — including page thumbnails, the document map pane, and parameters — are available in the side menu after you preview a report in the viewer. Access the sidebar options by clicking on the toggle sidebar to the left of the mobile toolbar.

The PageThumbnails pane — which appears by default in the sidebar — shows thumbnail views of all the report's pages. You can go directly to a page by clicking on its thumbnail.

The Document Map pane shows each value for labeled text boxes, groups, or sub reports. Click on the values to navigate to that area of the report.

Just like in other versions of FlexViewer, you can view reports with parameters in FlexViewer Mobile. You can view the Parameters pane by clicking on the sidebar's Parameters button, where you're prompted to enter a value to filter the data by. The pane automatically appears if a report contains parameters.

Export your reports by clicking on the Export button in the sidebar. You can choose from ten file formats (Adobe PDF, HTML, RTF, Open XML Word, Open XML Excel, TIFF, BMP, PNG, JPEG, and GIF) in the export pane before exporting.

As usual, the viewer's Portrait and Landscape elements display your report in the corresponding orientation. Clicking on the Page Setup button in the sidebar opens the Page Setup pane, where you can set the paper kind, orientation, and margins (in inches) for the report that's currently selected.

Clicking on the Zoom Bar button in the sidebar displays the zoom bar — which includes elements for zooming in, zooming out, and zooming by percentage value — at the bottom of the viewer.

The Print button displays the print dialog box to set printing options.

Watch this four-minute video on how to add a FlexViewer control to your MVC app.

Learn more about FlexViewer and FlexReport, a fast and modern cross-platform .NET reporting engine.

Download your free 30-day trial of ComponentOne Studio to try out FlexViewer Mobile and many other fast, flexible controls.