Custom Toolbar for the Web ReportViewer

Thursday, October 23, 2008 by Steve Tsokev | Comments 5

Our insatiable commitment to deliver more than expected in every aspect of our products resulted in me being curious, if we are as flexible as we think and whether one can always achieve his goal be it out of the box or with custom solution using our API and other controls if necessary.

Hmmm what could that custom solution be – how about a custom Toolbar for our web ReportViewer. For those of you, who are unfamiliar with our Web ReportViewer , here is a short description – it is designed to render Telerik Reports within ASP.NET projects and it has a toolbar that provides basic functionality for interacting with the currently-loaded report, such as:

  • Go to first page
  • Go to previous page
  • Go to a specific page
  • Total number of pages
  • Go to next page
  • Go to last page
  • Zoom level
  • Export: reports can be exported to Web Archive (MSHTML), TIFF, PDF, RTF, Excel and CSV
  • Refresh the report
  • Print the report: "true" print functionality requires the Adobe Reader plug-in (v.6 and above) and uses Image/PDF rendering. If the Adobe Reader browser plug-in is not installed then the default browser printing is used.

Ok these seem all fine and dandy, but what if we wanted to add another button that does something else for us – let’s say export and send the report as email attachment (for more info on that check out my previous blog post).

Well it’s all easy with our flexible client-side API, that allows you to interact with the shown report. Getting a reference to the ReportViewer is simple - the ReportViewer control creates a client-side object with the ClientID of the viewer. You can obtain reference to it by using the following javascript code:

var viewer = <%=ReportViewer1.ClientID%>

Once you have the client-side object you can use the exposed methods that are outlined in this help article. Now the question at hand is what UI should we provide for our custom toolbar, once we hide the built-in toolbar – what best option than our own Toolbar for ASP.NET AJAX. One look at it and it is clear that the OnClientButtonClickingHandler client handler would be where we would implement all of the interacting.

I would not go in details about the code, as I think a screenshot and attached working application worth a thousand words.

Enjoy!

custom toolbar screenshot [Download Application]

5 Comments

  • Jinzhao 21 Apr 2009
    Hi Steve,

    Your custom toolbar looks so cool !  Can you help me with some error?

    When i try to run your code, it says missing a file named :  Telerik.Reporting.Interfaces.

    Parser Error Message: Could not load file or assembly 'Telerik.Reporting.Interfaces, Version=2.8.8.925, Culture=neutral, PublicKeyToken=a9d7983dfcc261be' or one of its dependencies. The system cannot find the file specified.

    Where can i get this file? Can you email it to me please?

    Thanks very much.




  • Jinzhao 21 Apr 2009
    Hi,

    It's me again. My email is : hjzdhr@163.com.

    Thanks.
  • Siva 02 Dec 2009
    Hi,
    How to implement Find and FindNext Functionality in custom Toolbar.
  • John 17 Feb 2011
    Does this example still work?  I am using Q3 2010 release with VS 2010.  I have fixed all of the errors after VS does its conversions, but when I run it I get a 404 error that it can't find DefaultCS.aspx.

    Any ideas?

    Thanks,

    John
  • Carl Kelley 27 Jun 2011
    We need to selectively enable Excel export for Telerik Reports.  How does one download the sample app?  I've tried a bunch of links but none leads to the sample app. 

Add comment

  1. Formatting options
       
     
     
     
     
       
  2. (optional, emails won't be shown on public pages)
  3. (optional)