In order to work with HTML viewer using the Javascript, you need to follow a set of procedures. This involves calling the Loaded event first and then obtaining an instance of the ViewerViewModel. Once you have access to the ViewerViewModel, use its API methods and properties to work with the HTML Viewer.

Show Loaded Event

HtmlViewer raises a Loaded event to notify the listeners that the internal initialization is complete. Following is the sample code to raise a Loaded event:

$(document).ready(function () {

    $('#' + clientId).bind('loaded', function(){

    ...

    });

    });

Note: You can obtain the ClientId from the WebViewer control.

Show ViewerViewModel

In order to work with the API, obtain an instance of the ViewerViewModel first, using the GetViewModel(clientId) javascript function that searches ViewerViewModel array through the clientId. This function throws an exception if there is no ViewerViewModel with the requested clientId available.

Use code like the following to call an instance of the ViewerViewModel:

var viewModel = GetViewModel(clientId);

After obtaining the ViewerViewModel, the code can call API methods and properties.

Methods/Properties Example Description

Sidebar this.Sidebar Gets the Sidebar view model instance.

Toolbar this.Toolbar Gets the Toolbar view model instance.

PageLoaded this.PageLoaded(false); Gets the Boolean value indicating whether the page was loaded or not.

Export

this.Export(exportType, callback, saveAsDialog, settings)

Exports the loaded page to a specified format. In order to export without any errors the PageLoaded() property must be True.

exportType: Requested output format
callback: Function which obtains the URI of the exported document.
saveAsDialog: Optional request to show save as dialog after export.
settings: Optional export settings.

Note: ExportType is an Enumeration.
var ExportType = { Pdf, Html, Word, Xls, Xml };

Print this.Print() Prints the report using pdf printing. In order to print without any errors the PageLoaded() property must be True.

Show SidebarViewModel

SidebarViewModel allows you access to its various properties and methods to get the current state and show/hide sidebar and sidebar panels.

Methods/Properties	Example	Description
IsSidebarVisible	`this.IsSidebarVisible(false);`	Gets the Boolean value for entire sidebar visibility.
HideShowSidebar	`this.HideShowSidebar()`	Toggles Sidebar's visibility.
IsBookmarksPaneVisible	`this.IsBookmarksPaneVisible(false);`	Gets the Bookmarks Pane's visibility.
ShowBookmarksPane	`this.ShowBookmarksPane()`	Toggles Bookmarks Pane's visibility.
IsParametersPaneVisible	`this.IsParametersPaneVisible(false);`	Gets the Parameters Pane's visibility.
ShowParametersPane	`this.ShowParametersPane()`	Toggles Parameters Pane's visibility.
IsSearchPaneVisible	`this.IsSearchPaneVisible(false);`	Gets the Search Pane's visibility.
ShowSearchPane	`this.ShowSearchPane()`	Toggles Search Pane's visibility.
HideAll	`this.HideAll()`	Hides all Sidebar panes.

Show ToolbarViewModel

A ToolbarViewModel provides access to various toolbar properties and methods to get its current state and work with loaded reports.

Methods/Properties Example Description

Enabled this.Enabled(false); Gets the Boolean value determining whether the report was loaded successfully and the user can change the page or not.

PageCount this.PageCount(0); Gets the page count of the loaded report.

CurrentPage

this.CurrentPage(0);

Gets the currently opened page number.

Note: The Current Page starts from 1 after the report is loaded.

GoToPage this.GoToPage(number, force, callback) Opens the specified page of the loaded report.

ActiveReports Developer 7
Working with HTML Viewer using Javascript
See Also Support Forum

See Also