Adding a Print Button to HTML ViewerType in ActiveReports 7


The WebViewer control which is a part of the professional edition of ActiveReports, allow users to quickly display reports in web applications. It supports different types of ViewerType which are:

  • HtmlViewer
  • RawHTML
  • AcrobatReader
  • FlashViewer

However in this blog article our focus is on the HtmlViewer type which provides a scrollable view of a single page of the report at a time and downloads only HTML and JavaScript to the client browser. Some of our users have asked whether it is possible to add a Print button to the HtmlViewer toolbar? Well yes it is possible and here is how it will look like after addition to the toolbar: HtmlPrint


So let us now see how do we accomplish this task. The first thing which we need is to export the report displayed on the viewer using Custom HTML Outputter. So we will create a public class for the HTML outputter. The code required to go inside this class can be found here. Next in the Page_Load event we will use this class to export the report to HTML format and open the HTML in a new aspx page for printing. The Print will be initiated by sending a Print parameter to the aspx page. Here is the code:

protected void Page_Load(object sender, EventArgs e)  
   if (Request["Task"] != null)  
      if (Request["Task"].ToString().Contains("Print"))  
         rptCustHTML rpt = new rptCustHTML();  
         catch (Exception eRunReport)  
            //If the report fails to run, report the error to the user  
            Response.Write("<h1>Error running report:</h1>");  
         //Buffer this page's output until the report output is ready.  
         Response.Buffer = true;  

         //Clear any part of this page that might have already been buffered for output.  

         //Clear any headers that might have already been buffered (such as the content  
         //type for an HTML page)  

         //Tell the browser and the "network" that the resulting data of this page should  
         //be cached since this could be a dynamic report that changes upon each request.  

         //Tell the browser this is an HTML document so it will use an appropriate viewer.  
         Response.ContentType = "text/html";  

         //Create the HTML export object  
         GrapeCity.ActiveReports.Export.Html.Section.HtmlExport htmlExport1 = new GrapeCity.ActiveReports.Export.Html.Section.HtmlExport();  

         //Export the report to HTML in this session's webcache  
         MyCustomHtmlOutputter outputter = new MyCustomHtmlOutputter(this.Context);  
         htmlExport1.Export(rpt.Document, outputter, "");  
         Response.Redirect("ReportOutput" + "/" + System.IO.Path.GetFileName(outputter.mainPage));  

Next, we will add a Print button to the HTML viewer toolbar and call the JavaScript print method to print the contents displayed in the aspx page. The script code will look like this:

$(document).ready(function fn() {  
   $(".arvToolBar").append("<span><input id='btnPrint' type='Button' value='Print' onclick='print()'/></span>");  

function print() {  
   w ="WebForm1.aspx?Task=Print");  
   $(w.document).ready(function () {  
      window.setTimeout("w.print()", 2000);  

So it's done. A sample application demonstrating this implementation can be downloaded using the link below: Download Sample


GrapeCity Developer Tools
comments powered by Disqus