asp.netアプリケーションで、特定のレポートを開こうとしています。ReportViewerコントロールを幅100％、高さ100％に設定しています。これは、レポートがページ全体を占めることを意味すると思います。驚いたことに、そうではありません。IE7では、ページの幅全体を占めますが、高さのごく一部しか占めません。Firefoxでは、幅と高さの両方が台無しになっています。画面のほぼすべてを占める新しいページをブラウザで開いてもらいます。何か案は？
ありがとう！
82949 次
15 に答える
72
これは私が修正した方法です、見てください
<div style="Width:auto;">
<form id="form1" runat="server" style="width:100%; height:100%;">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<rsweb:ReportViewer ID="rptViewer" runat="server" Width="100%" Height="100%" AsyncRendering="False" SizeToReportContent="True">
</rsweb:ReportViewer>
</form></div>
魔法をかけるのはAsyncRendering="False" SizeToReportContent="True"です。残りは基本的なHTMLです。レポートは、設計どおりに表示されます。
余分なコードがあるかもしれませんが、それがあなたのために働くかどうか見てください。
それが役に立てば幸い
于 2010-07-09T03:26:31.350 に答える
11
これは私が修正した方法であり、javascriptを使用して高さを動的に設定し、IEとFirefoxの両方で機能します。最大ウィンドウサイズよりも大きいレポートでも機能します。
<rsweb:ReportViewer ID="ReportViewer1" runat="server" Width="100%" ShowBackButton="True" ProcessingMode="Remote" />
<script language="javascript" type="text/javascript">
ResizeReport();
function ResizeReport() {
var viewer = document.getElementById("<%= ReportViewer1.ClientID %>");
var htmlheight = document.documentElement.clientHeight;
viewer.style.height = (htmlheight - 30) + "px";
}
window.onresize = function resize() { ResizeReport(); }
</script>
于 2011-01-21T14:24:20.013 に答える
11
ReportViewer 11.0でも同じ問題が発生しましたが、設定するための秘訣は何でしたか
Height="100%"
SizeToReportContent="true"
while keeping
AsyncRendering="true"
例えば
<rsweb:ReportViewer ID="reportControl" runat="server" Width="750" Height="100%" AsyncRendering="true" SizeToReportContent="true">
これにより、実際にはコントロールのheight = "100％"のテーブルが生成されました。
于 2013-09-13T15:47:08.483 に答える
8
レポートの高さ全体に十分な静的な高さを指定します。私の知る限り、ReportViewerコントロールは基本的に1つの大きなdivタグでラップされているため、100％は機能しません。
于 2009-04-22T19:10:42.400 に答える
4
これは古い質問ですが、最近はまだ苦労しています。以下は、最新のすべてのブラウザー（IE8 / 9、Firefox、およびChromeでのみテスト済み）で正常に機能するようです。私にとってのキッカーは、doctypeとhtml要素の高さでした。
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html, body, form { width: 100%; height: 100%; margin: 0; padding: 0 }
</style>
</head>
<body>
<form runat="server">
<asp:scriptmanager runat="server" />
<rsweb:ReportViewer ID="ReportViewerControl" Width="100%" Height="100%" runat="server" />
</form>
</body>
</html>
于 2012-03-18T18:54:12.943 に答える
3
これはXHTML1.1標準の問題です。ページのDoctypeをtransitionalに変更して、高さを100％機能させます。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
または、それでも問題が解決しない場合は、完全に削除してください。
于 2009-04-22T19:09:44.307 に答える
3
ダン、これが私たちがちょっとしたjQueryの魔法でやったことです。
すべてのレポートは、マスターページと同じReport.Masterを使用しました。
<%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Report.master.vb" Inherits=".Report" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<style type="text/css">
html, body
{
margin: 0;
padding: 0;
border: none;
background-color: #FFFFFF;
overflow: hidden;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
setWindowSize();
});
$(window).resize(function () {
setWindowSize();
});
function setWindowSize() {
// http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
var myWidth = 0, myHeight = 0;
if (typeof (window.innerWidth) == 'number') {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
var r = $('div[id*="_report_"]:first');
r.width(myWidth);
r.height(myHeight - 32);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="rptScriptManager1" runat="server" />
<asp:ContentPlaceHolder ID="report" runat="server"/>
</form>
</body>
</html>
次に、各レポートページにReportViewerとそのプロパティが含まれていました。
<%@ Page Title="This Cool Report" MasterPageFile="~/masterpages/Report.Master" Language="vb" AutoEventWireup="false" CodeBehind="viewmycoolreport.aspx.vb" Inherits=".viewmycoolreport" %>
<%@ Register Assembly="Microsoft.ReportViewer.WebForms, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
<asp:Content ID="reportContent" ContentPlaceHolderID="report" runat="server">
<rsweb:ReportViewer ID="rptCoolReport" runat="server" Width="100%" ProcessingMode="Remote" SizeToReportContent="True" />
</asp:Content>
これで、レポートが読み込まれると、ReportViewerコントロールは、ウィンドウの準備とサイズ変更の両方で、コンテンツウィンドウのサイズに合わせてサイズ変更されます。jQueryセレクターは、「_ report_」を含むIDを持つ最初のdivを取得します（ReportViewerコントロールはクライアントID ctl_report_ <report_id>でレンダリングされるため）。ReportViewerコントロールのヘッダー（ページング、エクスポートなど）のため、高さは32ピクセル未満にする必要があります。
于 2012-03-19T18:05:43.280 に答える
3
次のオプションは、ASP.NETページでのSSRSレポートの読み込みの問題を修正します。
また、レポートをフルページに修正するZoomMode="PageWidth"という素晴らしいプロパティがあります。ZoomMode="FullPage"またはZoomMode="Percent"を使用することもできます。これらのプロパティはすべて、ASP.NETページでのページの読み込みの問題を修正します。
<rsweb:ReportViewer ID="ReportViewer1" runat="server" Height="100%" Width="100%" ZoomMode="Percent"></rsweb:ReportViewer>
于 2014-07-23T09:53:43.940 に答える
2
私は最近座って、ReportViewerそれでも許可しながらレポートコンテンツの高さまで拡張するためのコントロールと戦いました.AsyncRendering = true。これが私が行ったことです。これにはjQueryが必要であり、Report Viewer 2008（9.0.0.0）でのみテストされています。
<script type="text/javascript">
$(function() {
$('#<%= uxReportViewer.ClientID %> > iframe:eq(0)').bind('load', function() {
ReportViewerResize(this);
});
});
function ReportViewerResize(frame) {
var container = $('#<%= uxReportViewer.ClientID %>');
try {
var reportFrame = $(frame).contents().find('html')[0].document.frames["report"].document;
var reportHeight = $('div#oReportDiv > table > tbody > tr > td#oReportCell', reportFrame).height();
$(container).css({ height: '' + (reportHeight + 10) + 'px' });
} catch (e) { }
}
</script>
于 2011-02-28T04:38:37.390 に答える
2
このコードは少し長くなりますが、非同期レンダリングを使用した場合と使用しない場合でテストしたすべてのブラウザーで機能します。最良の部分は非同期モードであり、レポートの内容のサイズに拡張されます。非同期モードでは、ページのサイズ（上からのオフセットを差し引いたもの）に拡張されます。指摘しておきますが、これはVS2010バージョンのreportviewerに固有のものです。
<script type="text/javascript">
function ResizeReport(reportId){
var rep = document.getElementById(reportId);
var j = 0;
for (var i = 0; i < rep.childNodes.length; i++) {
var child = rep.childNodes[i];
if (child.nodeName == "DIV") {
j++;
if (j == 2) {
child.firstChild.style.overflow = "";
while (child.nodeName == "DIV") {
child = child.firstChild;
}
child.style.width = "1px";
rep.style.width = (child.clientWidth) + "px";
rep.style.height = "";
return;
}
}
}
if (rep.style.height != '400px') // default value //
return;
ResizeReportHeight(reportId);
window.onresize = function () { ResizeReportHeight(reportId); }
}
// Used to resize an async-report. Hand edit as needed.
function ResizeReportHeight(reportId, offsetFromBot) {
var rep = document.getElementById(reportId);
var iFrame = rep.getElementsByTagName('iframe')[0];
var htmlHeight = document.documentElement.clientHeight;
var offTop = 0;
var obj = iFrame;
while (obj) {
offTop += obj.offsetTop;
obj = obj.offsetParent;
}
var newHeight = (htmlHeight - offTop)
if (offsetFromBot)
newHeight -= offsetFromBot;
if (newHeight < 1)
newHeight = 1;
rep.style.height = "";
iFrame.style.height = newHeight + "px";
}
</script>
<script type="text/javascript">
window.onload = function () { ResizeReport("<%= reportviewer1.ClientID %>"); }
</script>
<rsweb:reportviewer ID="reportviewer1" runat="server" ProcessingMode="Remote" Width="100%" />
于 2012-10-04T17:29:07.267 に答える
0
私が経験したことに関しては、SizeToReportContentがfalseに設定されている場合、レポートビューアコントロールはデフォルトで400pxの高さでレンダリングされます。
動的な高さが必要な場合は、cssクラスをレポートビューアと次のcssに追加する必要があります。
#reportViewerContainer > span
{
display:block;
height:100% !important;
}
.reportViewer
{
height:100% !important;
}
「reportViewerContainer」は、レポートビューア（div、bodyなど）の親コンテナです。ビューアは、高さが0のスパンとしてレンダリングされ、内部がすべてのコンテンツです。これを変更すると、すべてが正常に機能するはずです。
于 2013-11-20T12:15:37.030 に答える
0
これが私が高さの問題を解決した方法です...私が望むほどエレガントではありませんが、それは機能します。
function ResizeReport() {
var htmlheight = document.documentElement.clientHeight - 110;
var reportViewer = $('div[id^=VisibleReportContent<%= this.bddr_report.ClientID %>]').parent();
reportViewer.css('height',htmlheight+'px');
}
于 2013-11-22T19:13:05.467 に答える
0
これは、JavaScriptを使用して高さを動的に設定し、IEとFirefoxの両方で機能するように修正するソリューションです。
<script type="text/javascript">
var ReportViewerForMvc = ReportViewerForMvc || (new function () {
var _iframeId = {};
var resizeIframe = function (msg) {
var height = 360;//here you specify the height if you want to put in
// percent specify value in string like "100%"
var width = 1255;// follow above
$(ReportViewerForMvc.getIframeId()).height(height);
$(ReportViewerForMvc.getIframeId()).width(width);
}
var addEvent = function (element, eventName, eventHandler) {
if (element.addEventListener) {
element.addEventListener(eventName, eventHandler);
} else if (element.attachEvent) {
element.attachEvent('on' + eventName, eventHandler);
}
}
this.setIframeId = function (value) {
_iframeId = '#' + value;
};
this.getIframeId = function () {
return _iframeId;
};
this.setAutoSize = function () {
addEvent(window, 'message', resizeIframe);
}
}());
ReportViewerForMvc.setAutoSize();
</script>- 次の「.aspx」のコードは変更しないでください
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="ReportViewerForMvc" Name="ReportViewerForMvc.Scripts.PostMessage.js" />
</Scripts>
</asp:ScriptManager>ここでは、ReportViewerForMvc.Scripts.PostMessage.jsを、幅を指定する独自のresizeIframeに明示的に置き換えています。
于 2015-07-16T15:35:24.797 に答える
0
私にとって最も簡単な方法は、レポートコントロールの幅と高さのプロパティを100％に設定することでした。トリックは、コントロールをdivで囲み、そのラッパーに高さを100vhに設定したスタイルを与えることです。
<div id="ssrsReportViewerWrapper" style="width: 100%; height: 100vh;">
<rsweb:ReportViewer
ID="ssrsReportViewer"
runat="server"
Width="100%"
Height="100%"
EnableViewState="true"
SizeToReportContent="false"
ZoomMode="Percent"
ZoomPercent="100"
ProcessingMode="Remote"
ShowExportControls="true"
ShowParameterPrompts="true" >
<ServerReport ReportPath="" ReportServerUrl="" />
</rsweb:ReportViewer>
</div>
于 2021-02-05T02:13:14.230 に答える
0
これは、CSSのみを使用し、必要に応じてReportViewerコントロールの上に余分なスペースを許可することで、この問題を解決するさらに別の方法です。
aspxドキュメントでは、次のことを行いました。
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Your page title</title>
<style type="text/css">
[id^=reportViewer1][role=document] {
height: calc(100vh - 50px) !important;
}
</style>
</head>
<body style="height: 100vh; margin: 0;">
ここでの魔法は、コントロールのドキュメント部分の高さを強制的に計算することです。元のコントロールの上に何もない場合は、50pxで十分です。本体を100vh（ビューアの高さの100％）に設定すると、スクロールバーを表示せずにブラウザのドキュメント領域全体に収まるようにするのにも役立ちます。
ReportViewerコントロールで、次のようにしました。
<rsweb:ReportViewer ID="reportViewer1" runat="server" Width="100%" Height="100%"
Font-Names="Verdana" Font-Size="8pt" AsyncRendering="True" SizeToReportContent="False">
</rsweb:ReportViewer>
CSScalcは古いブラウザでは機能しない可能性があることに注意することが重要です。ここでは、現在のChromeおよびEdgeブラウザーでうまく機能しました。
于 2021-12-23T17:47:12.943 に答える