ejReportViewer

The ReportViewer is a visualization control to view Microsoft SSRS RDL/RDLC files on a web page and it is powered by HTML5/JavaScript. It has support to bind DataSources/Parameters to the Reports and also supports exporting, paging, zooming and printing the report.

$(element).ejReportViewer()

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    // Create ReportViewer
    $('#reportviewer').ejReportViewer();    
</script>

Requires

• module:jQuery

• module:jquery.easing.1.3.js

• module:jquery.globalize.js

• module:jquery.easing.1.3.js

• module:jsrender.js

• module:ej.core.js

• module:ej.editor.js

• module:ej.dialog.js

• module:ej.treeview.js

• module:ej.dropdownlist.js

• module:ej.checkbox.js

• module:ej.waitingpopup.js

• module:ej.toolbar.js

• module:ej.radiobutton.js

• module:ej.splitter.js

• module:ej.button.js

• module:ej.chart.js

• module:ej.datepicker.js

• module:ej.map.js

• module:ej.touch.js

• module:ej.data.js

• module:ej.circulargauge.js

• module:ej.lineargauge.js

• module:ej.reportviewer.js

Members

dataSources array

Gets or sets the list of data sources for the RDLC report.

Default Value

• []

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ dataSources: [{name:"Menu Items",
    values:[{ OrderId: "21D60", FoodName: "Burger", Price: 20, Category: "Veg" },
            { OrderId: "21D61", FoodName: "Pizza", Price: 25, Category: "Non-Veg" },
            { OrderId: "21D63", FoodName: "Sandwiches", Price: 30, Category: "Non-Veg" },
            { OrderId: "21D65", FoodName: "Chicken Drum Sticks", Price: 23, Category: "Non-Veg" },
            { OrderId: "21D64", FoodName: "Fulka", Price: 15, Category: "Veg" }]}]
    });
</script>

dataSources.name string

Gets or sets the name of the data source.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ dataSources: [name:"Menu Items",
    values:[{ OrderId: "21D60", FoodName: "Burger", Price: 20, Category: "Veg" },
            { OrderId: "21D61", FoodName: "Pizza", Price: 25, Category: "Non-Veg" },
            { OrderId: "21D63", FoodName: "Sandwiches", Price: 30, Category: "Non-Veg" },
            { OrderId: "21D65", FoodName: "Chicken Drum Sticks", Price: 23, Category: "Non-Veg" },
            { OrderId: "21D64", FoodName: "Fulka", Price: 15, Category: "Veg" }]]
    });
</script>

dataSources.values array

Gets or sets the values of data source.

Default Value

• []

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ dataSources: [name:"Menu Items",
    values:[{ OrderId: "21D60", FoodName: "Burger", Price: 20, Category: "Veg" },
            { OrderId: "21D61", FoodName: "Pizza", Price: 25, Category: "Non-Veg" },
            { OrderId: "21D63", FoodName: "Sandwiches", Price: 30, Category: "Non-Veg" },
            { OrderId: "21D65", FoodName: "Chicken Drum Sticks", Price: 23, Category: "Non-Veg" },
            { OrderId: "21D64", FoodName: "Fulka", Price: 15, Category: "Veg" }]]
    });
</script>

enablePageCache boolean

Enables or disables the page cache of report.

Default Value

• false

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ enablePageCache: false });            
</script>

exportSettings object

Specifies the export settings.

exportSettings.exportOptions enum

Specifies the export formats.

Name	Description
All	Specifies the All property in ExportOptions to get all available options.
PDF	Specifies the PDF property in ExportOptions to get PDF option.
Word	Specifies the Word property in ExportOptions to get Word option.
Excel	Specifies the Excel property in ExportOptions to get Excel option.
HTML	Specifies the HTML property in ExportOptions to get HTML option.

Default Value

• ej.ReportViewer.ExportOptions.All

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer(
        {
            exportSettings:{ exportOptions: ej.ReportViewer.ExportOptions.Html | ej.ReportViewer.ExportOptions.Pdf }
        });            
</script>

exportSettings.excelFormat enum

Specifies the excel export format.

Name	Description
Excel97to2003	Specifies the Excel97to2003 property in ExcelFormats to get specified version of exported format.
Excel2007	Specifies the Excel2007 property in ExcelFormats to get specified version of exported format.
Excel2010	Specifies the Excel2010 property in ExcelFormats to get specified version of exported format.
Excel2013	Specifies the Excel2013 property in ExcelFormats to get specified version of exported format.

Default Value

• ej.ReportViewer.ExcelFormats.Excel97to2003

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer(
        {
            exportSettings:{ excelFormat: ej.ReportViewer.ExcelFormats.Excel97to2003}
        });            
</script>

exportSettings.wordFormat enum

Specifies the word export format.

Name	Description
Doc	Specifies the Doc property in WordFormats to get specified version of exported format.
Dot	Specifies the Dot property in WordFormats to get specified version of exported format.
DOCX	Specifies the DOCX property in WordFormats to get specified version of exported format.
Word2007	Specifies the Word2007 property in WordFormats to get specified version of exported format.
Word2010	Specifies the Word2010 property in WordFormats to get specified version of exported format.
Word2013	Specifies the Word2013 property in WordFormats to get specified version of exported format.
Word2007Dotx	Specifies the Word2007Dotx property in WordFormats to get specified version of exported format.
Word2010Dotx	Specifies the Word2010Dotx property in WordFormats to get specified version of exported format.
Word2013Dotx	Specifies the Word2013Dotx property in WordFormats to get specified version of exported format.
Word2007Docm	Specifies the Word2007Docm property in WordFormats to get specified version of exported format.
Word2010Docm	Specifies the Word2010Docm property in WordFormats to get specified version of exported format.
Word2013Docm	Specifies the Word2013Docm property in WordFormats to get specified version of exported format.
Word2007Dotm	Specifies the Word2007Dotm property in WordFormats to get specified version of exported format.
Word2010Dotm	Specifies the Word2010Dotm property in WordFormats to get specified version of exported format.
Word2013Dotm	Specifies the Word2013Dotm property in WordFormats to get specified version of exported format.
RTF	Specifies the RTF property in WordFormats to get specified version of exported format.
Txt	Specifies the Txt property in WordFormats to get specified version of exported format.
EPUB	Specifies the EPUB property in WordFormats to get specified version of exported format.
HTML	Specifies the HTML property in WordFormats to get specified version of exported format.
XML	Specifies the XML property in WordFormats to get specified version of exported format.
Automatic	Specifies the Automatic property in WordFormats to get specified version of exported format.

Default Value

• ej.ReportViewer.WordFormats.Doc

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer(
        {
            exportSettings:{ wordFormat: ej.ReportViewer.WordFormats.Doc}
        });            
</script>

isResponsive boolean

When set to true, adapts the report layout to fit the screen size of devices on which it renders.

Default Value

• true

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ isResponsive: true });            
</script>

locale string

Specifies the locale for report viewer.

Default Value

• “en-US”

Example

html

<div id="reportviewer"></div> 
<script>          
    $("#reportviewer").ejReportViewer(
        {
            locale: "it-IT"
        });             
</script>

pageSettings object

Specifies the page settings.

pageSettings.orientation enum

Specifies the print layout orientation.

Name	Description
Landscape	Specifies the Landscape property in pageSettings.orientation to get specified layout.
portrait	Specifies the portrait property in pageSettings.orientation to get specified layout.

Default Value

• null

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer(
        {
            pageSettings:{ orientation: ej.ReportViewer.Orientation.Landscape }
        });
</script>

pageSettings.paperSize enum

Specifies the paper size of print layout.

Name	Description
A3	Specifies the A3 as value in pageSettings.paperSize to get specified size.
portrait	Specifies the A4 as value in pageSettings.paperSize to get specified size.
B4_JIS	Specifies the B4(JIS) as value in pageSettings.paperSize to get specified size.
B5_JIS	Specifies the B5(JIS) as value in pageSettings.paperSize to get specified size.
Envelope_10	Specifies the Envelope #10 as value in pageSettings.paperSize to get specified size.
Envelope_Monarch	Specifies the Envelope as value in pageSettings.paperSize to get specified size.
Executive	Specifies the Executive as value in pageSettings.paperSize to get specified size.
Legal	Specifies the Legal as value in pageSettings.paperSize to get specified size.
Letter	Specifies the Letter as value in pageSettings.paperSize to get specified size.
Tabloid	Specifies the Tabloid as value in pageSettings.paperSize to get specified size.
Custom	Specifies the Custom as value in pageSettings.paperSize to get specified size.

Default Value

• null

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer(
        {
            pageSettings:{ paperSize: ej.ReportViewer.PaperSize.A4 }
        });
</script>

parameters array

Gets or sets the list of parameters associated with the report.

Default Value

• []

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ 
        parameters: [{
            name:"Vehicle",
            labels:["Motor Bikes"],
            prompt:"Please select the color",
            values:["Red","Green","Blue","Yellow","Black"],
            nullable:false
        }]       
    });
</script>

parameters.labels array

Gets or sets the parameter labels.

Default Value

• null

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ 
        parameters: [{
            name:"Vehicle",
            labels:["Motor Bikes"],
            prompt:"Please select the color",
            values:["Red","Green","Blue","Yellow","Black"],
            nullable:false
        }]
    });
</script>

parameters.name string

Gets or sets the name of the parameter.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({
        parameters: [{
            name:"Vehicle",
            labels:["Motor Bikes"],
            prompt:"Please select the color",
            values:["Red","Green","Blue","Yellow","Black"],
            nullable:false
        }]
    });
</script>

parameters.nullable boolean

Gets or sets whether the parameter allows nullable value or not.

Default Value

• false

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({
        parameters: [{
            name:"Vehicle",
            labels:["Motor Bikes"],
            prompt:"Please select the color",
            values:["Red","Green","Blue","Yellow","Black"],
            nullable:false
        }]
    });
</script>

parameters.prompt string

Gets or sets the prompt message associated with the specified parameter.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ 
        parameters: [{
            name:"Vehicle",
            labels:["Motor Bikes"],
            prompt:"Please select the Color",
            values:["Red","Green","Blue","Yellow","Black"],
            nullable:false
        }]
    });
</script>

parameters.values array

Gets or sets the parameter values.

Default Value

• []

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ 
        parameters: [{
            name:"Vehicle",
            labels:["Motor Bikes"],
            prompt:"Please select the color",
            values:["Red","Green","Blue","Yellow","Black"],
            nullable:false
        }]
    });
</script>

printMode boolean

Enables and disables the print mode.

Default Value

• false

Example

html

<div id="reportviewer"></div> 
<script>          
    $("#reportviewer").ejReportViewer(
        {
            printMode:true
        });             
</script>

printOptions enum

Specifies the print option of the report.

Name	Description
Default	Specifies the Default property in printOptions.
NewTab	Specifies the NewTab property in printOptions.
None	Specifies the None property in printOptions.

Default Value

• ej.ReportViewer.PrintOptions.Default

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ printOption: ej.ReportViewer.PrintOptions.Default });            
</script>

processingMode enum

Specifies the processing mode of the report.

Name	Description
Remote	Specifies the Remote property in processingMode.
Local	Specifies the Local property in processingMode.

Default Value

• ej.ReportViewer.ProcessingMode.Remote

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ processingMode: ej.ReportViewer.ProcessingMode.Remote });            
</script>

renderMode enum

Specifies the render layout.

Name	Description
Default	Specifies the Default property in RenderMode to get default output.
Mobile	Specifies the Mobile property in RenderMode to get specified output.
Desktop	Specifies the Desktop property in RenderMode to get specified output.

Default Value

• ej.ReportViewer.RenderMode.Default

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ renderMode: ej.ReportViewer.RenderMode.Default });            
</script>

reportPath string

Gets or sets the path of the report file.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ reportPath: "~/App_Data/Sample.rdl" });            
</script>

reportServerUrl string

Gets or sets the reports server URL.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ reportServerUrl: "http://mvc.syncfusion.com/reportserver" });            
</script>

reportServiceUrl string

Specifies the report Web API service URL.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
    $("#reportviewer").ejReportViewer({ reportServiceUrl: "../api/RDLReport" });            
</script>

toolbarSettings object

Specifies the toolbar settings.

toolbarSettings.click string

Fires when user click on toolbar item in the toolbar.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>          
    $("#reportviewer").ejReportViewer(
        {
            toolbarSettings:{click: "onToolbarClick"}
        });         
</script>

toolbarSettings.items enum

Specifies the toolbar items.

Name	Description
Print	Specifies the Print as value in ToolbarItems to get specified item.
Refresh	Specifies the Refresh as value in ToolbarItems to get specified item.
Zoom	Specifies the Zoom as value in ToolbarItems to get specified item.
FittoPage	Specifies the FittoPage as value in ToolbarItems to get specified item.
Export	Specifies the Export as value in ToolbarItems to get specified item.
PageNavigation	Specifies the PageNavigation as value in ToolbarItems to get specified item.
Parameters	Specifies the Parameters as value in ToolbarItems to get specified item.
PrintLayout	Specifies the PrintLayout as value in ToolbarItems to get specified item.
PageSetup	Specifies the PageSetup as value in ToolbarItems to get specified item.

Default Value

• ej.ReportViewer.ToolbarItems.All

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer(
        {
            toolbarSettings:{ items: ej.ReportViewer.ToolbarItems.All }
        });
</script>

toolbarSettings.showToolbar boolean

Shows or hides the toolbar.

Default Value

• true

Example

html

<div id="reportviewer"></div> 
<script>          
    $("#reportviewer").ejReportViewer(
        {
            toolbarSettings:{ showToolbar: true }
        });         
</script>

toolbarSettings.showTooltip boolean

Shows or hides the tooltip of toolbar items.

Default Value

• true

Example

html

<div id="reportviewer"></div> 
<script>          
    $("#reportviewer").ejReportViewer(
        {
            toolbarSettings:{ showTooltip: true }
        });         
</script>

toolbarSettings.templateId string

Specifies the toolbar template ID.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>          
    $("#reportviewer").ejReportViewer(
        {
            toolbarSettings:{ templateId: "customtoolbarId" }
        });         
</script>

zoomFactor number

Gets or sets the zoom factor for report viewer.

Default Value

• 1

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ zoomFactor:  2 });            
</script>

Methods

exportReport()

Export the report to the specified format.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.exportReport(); //Exports the reports
</script>

fitToPage()

Fit the report page to the container.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.fitToPage(); // To fit the report page.
</script>

fitToPageHeight()

Fit the report page height to the container.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.fitToPageHeight(); // To fit the report page height.
</script>

fitToPageWidth()

Fit the report page width to the container.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.fitToPageWidth(); // To fit the report page width.
</script>

getDataSetNames()

Get the available datasets name of the rdlc report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.getDataSetNames(); // To get the dataset names.
</script>

getParameters()

Get the available parameters of the report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer"); 
    reportviewerObj.getParameters(); // To get the parameters.
</script>

gotoFirstPage()

Navigate to first page of report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.gotoFirstPage(); // To navigate to first page
</script>

gotoLastPage()

Navigate to last page of the report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.gotoLastPage(); // Navigate to the last page
</script>

gotoNextPage()

Navigate to next page from the current page.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.gotoNextPage(); //To navigate to the next page
</script>

gotoPageIndex()

Go to specific page index of the report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.gotoPageIndex(5); // To navigate the specific page
</script>

gotoPreviousPage()

Navigate to previous page from the current page.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.gotoPreviousPage(); // To navigate to the previous page
</script>

print()

Print the report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.print(); //To perform print operation.
</script>

printLayout()

Apply print layout to the report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.printLayout(); //Changes between print layout and normal modes.
</script>

refresh()

Refresh the report.

Example

html

<div id="reportviewer">ReportViewer</div> 
<script>
    var reportviewerObj = $("#reportviewer").data("ejReportViewer");
    reportviewerObj.refresh(); // To refresh the report.
</script>

Events

destroy

Fires when the report viewer is destroyed successfully.If you want to perform any operation after destroying the reportviewer control,you can make use of the destroy event.

Name	Type	Description
argument	object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div>
<script>
    $("#reportviewer").ejReportViewer({
        destroy: function (args) {
            // Write a code block to perform any operation after destroy of reportviewer.
        }
    });
</script>

drillThrough

Fires during drill through action done in report.If you want to perform any operation when a drill through action is performed, you can make use of the drillThrough event.

Name	Type	Description
argument	Object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. actionInfo Object returns the actionInfo's parameters bookmarkLink, hyperLink, reportName, parameters. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ 
        drillThrough: function (args) {
            // Write a code block to perform any operation when drill through action occurs in report.
        }
    });                   
</script>

renderingBegin

Fires before report rendering is completed.If you want to perform any operation before the rendering of report,you can make use of the renderingBegin event.

Name	Type	Description
argument	Object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div> 
<script>  
    //rendering begin event for report.               
    $("#reportviewer").ejReportViewer({
        renderingBegin:function(args) {
            // Write a code block to perform any operation before rendering.
        }
    });                 
</script>

renderingComplete

Fires after report rendering completed.If you want to perform any operation after the rendering of report,you can make use of this renderingComplete event.

Name	Type	Description
argument	Object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. model object returns the report model. type string returns the name of the event. reportParameters object returns the collection of parameters. reportParameters object returns the collection of parameters.

Example

html

<div id="reportviewer"></div> 
<script>        
    //rendering complete event for reportviewer control.
    $("#reportviewer").ejReportViewer({ 
        renderingComplete:function(args) {
            // Write a code block to perform any operation after rendering completed.
        }
    });            
</script>

reportError

Fires when any error occurred while rendering the report.If you want to perform any operation when an error occurs in the report, you can make use of the reportError event.

Name	Type	Description
argument	Object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. error string returns the error details. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({
        reportError: function (args) {
            // Write a code block to perform any operation when report error occurs.
        }
    });                         
</script>

reportExport

Fires when the report is being exported.If you want to perform any operation before exporting of report, you can make use of the reportExport event.

Name	Type	Description
argument	Object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ 
        reportExport:  function (args) {
            // Write a code block to perform any action before exporting of report.
        }
    });           
</script>

reportLoaded

Fires when the report is loaded.If you want to perform any operation after the successful loading of report, you can make use of the reportLoaded event.

Name	Type	Description
argument	Object	event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({
        reportLoaded: function(args) {
            // Write a code block to perform any action when the report is loaded successfully.
        }
    });             
</script>

viewReportClick

Fires when click the View Report Button.

Name	Type	Description
argument	Object	Event parameters from reportviewer. Name Type Description cancel boolean true if the event should be canceled; otherwise, false. parameters Object returns the parameter collection. model object returns the report model. type string returns the name of the event.

Example

html

<div id="reportviewer"></div> 
<script>        
    $("#reportviewer").ejReportViewer({ 
        viewReportClick:  function (args) {
            // Write a code block to perform any operation after destroy of reportviewer.
        }
    });           
</script>

serviceAuthorizationToken string

Specifies the token for authorizing reporting service url to process the reports.

Default Value

• empty

Example

html

<div id="reportviewer"></div> 
<script>
      $(function () {
            var dataValue = "";
            var apiRequest = new Object();
            apiRequest.password = "demo";
            apiRequest.userid = "guest";
            $.ajax({
                type: "POST",
                url: "http://reportserver.syncfusion.com/api/get-user-key",
                data: apiRequest,
                success: function (data) {
                    dataValue = data.Token;
                    var token = JSON.parse(dataValue);
                    $("#reportviewer").ejReportViewer(
                        {
                            reportServiceUrl: "http://reportserver.syncfusion.com/ReportService/api/Viewer",
                            serviceAuthorizationToken: token["token_type"] + " " + token["access_token"],
                            reportPath: '/Sample Reports/Company Sales'
                        });
                }
            });
        });            
</script>