Question

大家好我正在尝试使用HTML5平台上的Telerik Reporting制作样本报告。

这是我的代码，能够制作“模板”

<!DOCTYPE html>

<head> 



<title>Telerik HTML5 Report Viewer</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

<link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.blueopal.min.css" rel="stylesheet" />
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>

<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" />

<link href="ReportViewer/styles/ReportViewer-8.0.14.225.css" rel="stylesheet" />
<script src="ReportViewer/js/ReportViewer-8.0.14.225.js"></script>

<style>
    #reportViewer1 {
        position: absolute;
        left: 5px;
        right: 5px;
        top: 5px;
        bottom: 5px;

        font-family: 'segoe ui', 'ms sans serif';

        overflow: hidden;
    }
</style>

<div id="reportViewer1" class="k-widget">
    loading...
</div>

<script type="text/javascript">
    $("#reportViewer1").telerik_ReportViewer({
        serviceUrl: "../api/reports/",
        templateUrl: '/ReportViewer/templates/telerikReportViewerTemplate.html',
        reportSource: { report: "Product Catalog.trdx" }
    });

</script>

如何调用示例报表：“Product Catalog.trdx”到我的HTML页面？谢谢！

Answer 1

据我所知，答案取决于一些事情。如果您正在使用Telerik报告示例演示而不是您应该已经有效的东西，那么如果您从头开始构建一个，那么它就会引发您正在使用哪个Report Resolver的问题。您提供的示例使我认为您要使用ReportFileResolver。使用它的关键是你需要'Product Catalog.trdx'在项目文件夹中，名称必须完全匹配。因此，如果您正在使用WebApi或MVC项目，那么产品文件应该与您的html页面处于相同的文件深度（IE不能隐藏在文件夹中，除非您指定它应该是）。

WebApi或MVC项目中使用的Reports Controller将看起来像这样。

protected override IReportResolver CreateReportResolver()
    {
        var appPath = HttpContext.Current.Server.MapPath("~/");

        return new ReportFileResolver(appPath);
    }

这里的技巧是报告源和您在此提供的路径一起工作。您基本上可以将其视为appPath + report =它将在哪里查找文件。

如何在HTML5上进行样本telerik报告

1 个答案: