locked
ReportViewer with Firefox8 and Chrome15 RRS feed

  • Question

  • User1704224838 posted

    Hi all

    I have an asp.net mvc3 project, it has some reports in aspx web pages. Everything works great in 2-3 weeks ago, but now, when I open the reports pages in FireFox8 and Chrome 15, the reports can not be displayed correctly.

    In FF8, report content can be shown, but looks like css doesn't loaded, and report head control look like this:

    In Chrome15, report head looks fine but content isn't shown up. I can see it has correct contents when using Firebug to view those <td>.

    Since data can ben loaded to browser, I think it maybe a browser compatibility problem, am I right?

    Does anyone seeing same issues? I'm open to any suggestions.

    BTW:My report viewer's version is 10.0.0.0.

    Thanks.

    Monday, December 12, 2011 11:42 AM

Answers

  • User1704224838 posted

    In Chrome, it's the "height=100%" problem.

    Once I add following jQuery code, the report area can ben shown.

            $(function () {
                $("#ReportViewer1_ctl09").css("height", "auto");
            });

    In FireFox, the report page raise an error as following:

    "Microsoft.Reporting.WebForms.HttpHandlerInputException 缺少 URL 参数: Name"

    and the Query String is: "OpType=BackImage&amp;Version=10.0.40219.329&amp;Color=%23ECE9D8&amp;Name=Microsoft.Reporting.WebForms.Icons.toolbar_bk.png"

    I think the "amp;" can not be resolved correctly then caused this exception.

    I'm still finding a way to solve this.

    Anybody have any ideas?

    Thanks.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, January 11, 2012 2:05 AM
  • User1704224838 posted

    according to this article, I think it's caused by a proxy that handles http request..

    I checked my request, there's a "FiftyOne ..." in "Brwoser" property of "Request" ojbect.

    Since fifty one is no longer used in this project, I removed it from Bin and web config, then the report can be shown in FireFox!

    Hope this article can be usefule to other guys.

    Thanks.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, January 11, 2012 2:25 AM

All replies

  • User-1528094326 posted

    I cannot reproduce the issue. I tried the newest edition of firefox and Chrome vs 15.0.874.121 and it spaces out just fine. Make sure that you statically set the width and height if need be of the control.

    <rsweb:ReportViewer ID="ReportViewer1" runat="server" Width="100%" />

    Monday, December 12, 2011 1:58 PM
  • User1704224838 posted

    Hi Scott, thank you for your looking around this.

    I have noticed when browse in firefox, server will catch an [Microsoft.Reporting.WebForms.HttpHandlerInputException: Missing URL parameter: Name], and the query string is OpType=BackImage&amp;Version=10.0.40219.329&amp;Color=%23ECE9D8&amp;Name=Microsoft.Reporting.WebForms.Icons.toolbar_bk.png; path_info is Reserved.ReportViewerWebControl.axd

    This may be the reason why firefox and chorme can't show page with correct CSS.

    I don't know why this happens in Firefox, while in IE everything is fine.

    I've found this link shows same excpetion: http://social.msdn.microsoft.com/Forums/eu/vsreportcontrols/thread/80ce3ee8-e65b-476c-b668-ecc8e83ea73d

    But I'm not sure how did he solve this, can you or somebody else gives some tip or example code to solve this?

    and in Chrome

    When browse in chrome, I found the report data is loaded into DOM, and surronded by a <table> with id="ReportViewer1_fixedTable". Inside that <table> element, there's a div with id="ReportViewer1_ctl09" nested in <td style="vertical-align: top; height: 100%;">, if I remove the "height: 100%" from firebug, the report can be seen. 

    this link http://www.apptools.com/examples/tableheight.php, explained why this 100% cannot be rendered correctly, but I'm still failed when trying to give a fixed height via CSS, here's my code,

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ItemReport.aspx.cs" Inherits="IntuitChina.CommonReports.ItemReport" %>

    <%@ Register Assembly="Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"
        Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>
    <html>
    <head id="Head1" runat="server">
        <title></title>
        <style type="text/css">
            .ReportViewer1_ctl09
            {
                height: 900px;
            }
            html, body
            {
                margin: 0;
                padding: 0;
                height: 1000px;
                border: none;
            }
            
            fix_height
            {
                height: 1000px;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <div class="fix_height" style="width: auto; height: 1000px">
            <rsweb:ReportViewer ID="ReportViewer1" runat="server" Font-Names="Verdana" Font-Size="8pt"
                InteractiveDeviceInfos="(Collection)" ProcessingMode="Local" WaitMessageFont-Names="Verdana"
                WaitMessageFont-Size="14pt" Height="900px" Width="800px" CssClass="fix_height">
            </rsweb:ReportViewer>
        </div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        </form>
    </body>
    </html>

    could you please help me to check it out?

    Thanks.

    Wednesday, December 21, 2011 2:08 AM
  • User-1528094326 posted

    Try verifying that the handler is listed under httphandlers in your web.config file.

    <httpHandlers>
        <add path="Reserved.ReportViewerWebControl.axd" verb="*" type="Microsoft.Reporting.WebForms.HttpHandler, Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" validate="false"/>
    </httpHandlers>
    Wednesday, December 21, 2011 2:53 AM
  • User1704224838 posted

    Yes, that handler is in my httpHandlers in web.config

    here's my httpHandler section

        <httpHandlers>
          <add path="asset.axd" verb="GET,HEAD" type="Telerik.Web.Mvc.WebAssetHttpHandler, Telerik.Web.Mvc" validate="false"/>
          <add path="Reserved.ReportViewerWebControl.axd" verb="*" type="Microsoft.Reporting.WebForms.HttpHandler, Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" validate="false"/>
          <add verb="POST,GET,HEAD" path="elmah.axd" type="Elmah.ErrorLogPageFactory, Elmah"/>
        </httpHandlers>

    also, could you please review my first reply on you? I've edit that, since I found in Chrome, it may be caused by another issue, and I think it is also the reason why report content cannot be shown in FireFox.
    That's the 100% table height problem.

    Thank you very much!

    Wednesday, December 21, 2011 6:53 AM
  • User1704224838 posted

    In Chrome, it's the "height=100%" problem.

    Once I add following jQuery code, the report area can ben shown.

            $(function () {
                $("#ReportViewer1_ctl09").css("height", "auto");
            });

    In FireFox, the report page raise an error as following:

    "Microsoft.Reporting.WebForms.HttpHandlerInputException 缺少 URL 参数: Name"

    and the Query String is: "OpType=BackImage&amp;Version=10.0.40219.329&amp;Color=%23ECE9D8&amp;Name=Microsoft.Reporting.WebForms.Icons.toolbar_bk.png"

    I think the "amp;" can not be resolved correctly then caused this exception.

    I'm still finding a way to solve this.

    Anybody have any ideas?

    Thanks.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, January 11, 2012 2:05 AM
  • User1704224838 posted

    according to this article, I think it's caused by a proxy that handles http request..

    I checked my request, there's a "FiftyOne ..." in "Brwoser" property of "Request" ojbect.

    Since fifty one is no longer used in this project, I removed it from Bin and web config, then the report can be shown in FireFox!

    Hope this article can be usefule to other guys.

    Thanks.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, January 11, 2012 2:25 AM
  • User1944386031 posted

    We found out the fix for shirking problem of report. which was by increasing oReportCell size to 100% of reportviewer size. Also Style changes of top bar In chrome by float:Left.

    SCRIPT:

    var t1;

    function manageWidthReportViewer(behID) {
    t1 = window.setInterval("SetWidthForCrome()", 10);
    }
    function SetWidthForCrome() {
    var mainReportViewer = document.getElementById('iFrameMainReportViewerContainer');
    var reportFrame = mainReportViewer.contentWindow.document.getElementById('ReportFramereportViewer');
    var report = reportFrame.contentWindow.document.getElementById("report");
    if(mainReportViewer.contentDocument.getElementById("reportViewer") != null)
    mainReportViewer.contentDocument.getElementById("reportViewer").childNodes[2].childNodes[1].childNodes[1].style.float = "left";
    if (report!=null && report.contentDocument.getElementById("oReportCell") != null) {
    report.contentDocument.getElementById("oReportCell").style.width="100%";
    window.clearInterval(t1);
    }
    }
    function SetReportViewerDim() {
    var controlPanelHeight = screen.availHeight - 210;
    var mainReportViewer = document.getElementById('iFrameMainReportViewerContainer'); //set
    mainReportViewer.removeAttribute('height');
    mainReportViewer.style.height = (controlPanelHeight-37) + "px";
    var reportViewer = mainReportViewer.contentWindow.document.getElementById('reportViewer'); //set
    reportViewer.style.height = (controlPanelHeight) + "px";
    var reportFrame = mainReportViewer.contentWindow.document.getElementById('ReportFramereportViewer');
    if (Sys.Browser.name == "Safari") {
    manageWidthReportViewer(reportFrame);
    }
    }
    Thursday, January 12, 2012 7:56 AM