This is a migrated thread and some comments may be shown as answers.

ReportViewer squishing content in IE 11 - ASP.NET

4 Answers 94 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Mike Hobbs
Top achievements
Rank 1
Mike Hobbs asked on 26 May 2014, 08:12 PM
When I render a report in a new window using version 11 of Internet Explorer (IE 11) the content gets squished.  See attached image of example.  If I show the ReportViewer refresh button and click it the report renders correctly.  I've tried many different page and report life cycle events to refresh to get it to render correctly on opening, but nothing worked.  I changed the Height setting as well for the ReportViewer and no good still.  It exports fine and renders correctly in IE 10.  I distribute to 2 different versions of IIS and both have the same problem when IE 11 used (7.0 and 7.5 IIS used to test).  I have attached a screen image of what I'm talking about too.

I'm using version 8.0.14.225 of the Reporting control.
The web site is using Framework version 4.
I've set the Height to: 550px, 800px, & 100%.  Always get the same squished result and size on opening of the report.

The report is opened by passing URL for the page that holds the ReportViewer in JavaScript and the command looks like:
window.open(rValue, "Report", "resizable=1,width=1000,height=600");

The page design source is pasted below (I already tried setting id's as specified in other forum post; this also didn't work):
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Audit.aspx.cs" Inherits="Reports_Audit" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Audit Report</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:ReportViewer ID="ReportViewer1" runat="server"
ShowParametersButton="False" ShowRefreshButton="False" Width="100%"
Height="500px" ShowDocumentMapButton="False" DocumentMapVisible="False">
</telerik:ReportViewer>
</div>
</form>
</body>
</html>

4 Answers, 1 is accepted

Sort by
0
Stef
Telerik team
answered on 27 May 2014, 02:07 PM
Hello Mike,

Please test to exclude all external styles and load the page in IE11. Also include a meta tag to force Internet Explorer to use Standard mode to render its content:
<meta http-equiv="x-ua-compatible" content="IE=edge">
For more details check the following MSDN article: Specifying legacy document modes.

If you need further help, please open a support ticket and send us a runnable demo project with your settings.

Regards,
Stef
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Mike Hobbs
Top achievements
Rank 1
answered on 27 May 2014, 03:13 PM
I tried suggestions above, but the problem remains.  It will take some time for me to create a demo of this.
0
Mike Hobbs
Top achievements
Rank 1
answered on 28 May 2014, 12:42 PM
While building the demo I found the solution to the problem.  Commenting out the DOCTYPE doesn't work, but replacing it with:
<!DOCTYPE html>

does work.  This is the only change necessary to resolve the problem.  None of the other changes suggested above were necessary.  The ReportViewer now displays the report correctly for both IE versions 10 & 11.  Tested under IIS version 7.5.  Both machines are Win 7 running 64 bit.
0
Stef
Telerik team
answered on 29 May 2014, 07:18 AM
Hi Mike,

It is good to hear you managed to resolve the issue.

Microsoft also recommends the usage of the HTML5 document type to define document compatibility for IE browsers:

"In general, most public websites should declare the HTML5 document type so that they are displayed in standards mode, which reflects the strongest support available to a browser for industry standards. To do so, start each of your webpages with the following line.
<!DOCTYPE html> 
"

Regards,
Stef
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
General Discussions
Asked by
Mike Hobbs
Top achievements
Rank 1
Answers by
Stef
Telerik team
Mike Hobbs
Top achievements
Rank 1
Share this question
or