Question

我设计了一个4尺寸（8.5 x 11.0）的rdlc报告。当我将报告显示到reportviewer时，它将无法在宽度方面正确显示。

下面是截图：

enter image description here

我还为报告查看器编写了几个代码，如下所示：

 <div id="dvRpt" runat="Server" style="overflow: auto; width: 100%; height: 440px">
   <rsweb:ReportViewer ID="ReportViewer1" ShowPrintButton="true" AsyncRendering="false" SizeToReportContent="true"  Width="93%" Height="400px" runat="server">
   </rsweb:ReportViewer>

Answer 1

我遇到了同样的问题。它在Mozilla Firefox中表现良好，但在Google Chrome和现代版本的Internet Explorer上看起来很不错。

深入研究这个问题，我发现报告的内容位于一个标识为oReportCell的表格单元格中，如下所示：

<div id="oReportDiv">
    <table>
        <tr>
            <td id="oReportCell"><!-- Report content goes here --></td>
            <td height="0" width="100%"><!-- Empty cell with problematic width --></td>
        </tr>
    </table>
</div>

我的修复方法是删除宽度=＆＃34; 100％＆＃34;那个细胞。这有点棘手，因为报告是在iframe内生成的，而在其他帧内生成的。使用CSS强制宽度不起作用。

我已经创建了这条JavaScript，它可以在生成报表查看器的页面上运行。当您浏览报告的页面时，它需要监听帧的加载事件。

将ID替换为您的报告查看器ID：

(function() {
    var _init = function() {
        var reportControl, frameId, frame;
        reportControl = document.getElementById('ReportViewer1'); // ID of the ReportViewer control
        if (!reportControl || !reportControl.ClientController) return;
        frameId = reportControl.ClientController.m_docMapReportFrameID;
        if (!frameId) return;
        frame = document.getElementById(frameId);
        if (!frame || !frame.addEventListener) return;
        frame.addEventListener('load', (function(frame) {
            return function(e) {
                _reportFrameLoaded(frame);
            };
        })(frame), false);
    },
    _reportFrameLoaded = function(frame) {
        var innerDoc;
        innerDoc = frame.contentDocument;
        frame = innerDoc.getElementById('report');
        if (!frame) return;
        frame.addEventListener('load', (function(frame) {
            return function(e) {
                _innerReportFrameLoaded(frame);
            };
        })(frame), false);
        // If the frame already has content, it may be loaded before 
        // this load function has run. Call the child onload function now
        if (frame.contentDocument) {
            _innerReportFrameLoaded(frame);
        }
    },
    _innerReportFrameLoaded = function(frame) {
        var innerDoc, cell1;
        innerDoc = frame.contentDocument;
        cell1 = innerDoc.getElementById('oReportCell');
        if (!cell1) return;
        if (cell1.nextSibling.hasAttribute('width')) {
            cell1.nextSibling.removeAttribute('width');
        }
    };
    if (document.addEventListener) {
        document.addEventListener('DOMContentLoaded', _init, false);
    }
})();

Answer 2

使ReportViewer的宽度=＆＃34; 100％＆＃34;并尝试

<div id="dvRpt" runat="Server" style="width: 100%; height: 440px">
   <rsweb:ReportViewer ID="ReportViewer1" ShowPrintButton="true" AsyncRendering="false" SizeToReportContent="true"  Width="100%" Height="400px" runat="server">
   </rsweb:ReportViewer>

Answer 3

<form id="form1" runat="server" > 
<div style="Width:auto;">
   <rsweb:ReportViewer ID="rptViewer" runat="server" Width="100%" Height="100%" AsyncRendering="False" SizeToReportContent="True">
    </rsweb:ReportViewer>
</div>
</form

Answer 4

只在你的CSS上申请

   <style>
         table{
        width:100%;
        }
    </style>

Answer 5

<rsweb:ReportViewer ID="ReportViewer1" runat="server" ProcessingMode="Remote" width="100%"></rsweb:ReportViewer>

这样就可以了。

在ReportViewer中显示RDLC报告中的宽度问题

5 个答案: