【Stimulsoft Reports.JS教程】将 表分配给Viewer、更改 表查看器主题和查看器中的全屏模式

【下载Stimulsoft Reports.JS最新版本】

（一）将 表分配给Viewer

此示例显示如何加载 表并将其分配给查看器，创建StiReport 类型的 表对象 ，然后通过调用loadFile（）方法加载 表模板文件 。要在查看器中显示 表，将 表对象分配给查看者的 表属性即可。如果未呈现 表，则查看器会自动呈现它：

// Create the report viewer with default optionsvar viewer = new Stimulsoft.Viewer.StiViewer(null, "StiViewer", false);// Create a new report instancevar report = new Stimulsoft.Report.StiReport();// Load report from urlreport.loadFile("../reports/SimpleList.mrt");// Assign report to the viewer, the report will be built automatically after rendering the viewerviewer.report = report;

示例代码的结果如下图所示。

（二）更改 表查看器主题

此示例显示如何更改查看器默认主题。将head部分中主题的CSS文件替换为另一个可用主题，可用于超过15个 就绪主题，还可以根据需要调整CSS文件。例如，将Office2007 Blue主题应用于查看器：

<!-- Report viewer Office2007 Blue style --><link href="../css/stimulsoft.viewer.office2007.blue.css" rel="stylesheet">

示例代码的结果如下图所示。

（三）查看器中的全屏模式

此示例显示如何在默认情况下以全屏模式显示 表查看器，在全屏模式下，查看器将显示在浏览器窗口的所有可用区域中。此外，要切换此模式，使用查看器工具栏上的全屏阅读按钮。要在默认情况下启用此模式，您需要在StiViewerOptions对象中设置fullScreenMode选项。例如，还设置为启用scrollbarsMode选项，此选项允许在查看器内使用内置 表窗口：

// Set full screen mode for the viewervar options = new Stimulsoft.Viewer.StiViewerOptions();options.appearance.scrollbarsMode = true;options.appearance.fullScreenMode = true;// Create the report viewer with specified optionsvar viewer = new Stimulsoft.Viewer.StiViewer(options, "StiViewer", false);

示例代码的结果如下图所示。

下载示例

标签：JavaScript 表 表控件Stimulsoft