SSRS ReportViewer 2010 Iframe IE Problem

Question

My problem relates to trying to include an SSRS (SQL Server) Report inside my MVC application.

I've settled on the hybrid solution of having a WebForm with the ReportViewer Control in and then on my MVC View pages having an iframe reference this WebForm page. The tricky part is that the iframe needs to be dynamically populated with the report rather than using src due to posting parameters to the WebForm.

It works perfectly in Firefox and Chrome, however IE throws a "Sys is Undefined" javascript error.

Using src on the iframe works in IE, but I can't find a way to post parameters (don't want to use something like /Report.aspx?param1=test due to the possible length).

Its a ASP.NET MVC 2 project, .NET 4, Visual Studio 2010 on Windows 7 x74 if its any help.

So here is the code (I could provide the VS2010 project files if anyone wants them)

In my webform:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Report.aspx.cs" Inherits="SSRSMVC.Views.Home.Report" %>

<%@ Register Assembly="Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"
    Namespace="Microsoft.Reporting.WebForms" TagPrefix="rsweb" %>

<!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">
<body>
    <form id="RSForm" runat="server">

    <asp:ScriptManager ID="ScriptManager" runat="server" EnablePartialRendering="true" ScriptMode="Release">
    </asp:ScriptManager>

    <asp:UpdatePanel ID="ReportViewerUP" runat="server">
        <ContentTemplate>
            <rsweb:ReportViewer ID="ReportViewer" runat="server" Width="100%" Height="380px" ProcessingMode="Local"
             InteractivityPostBackMode="AlwaysAsynchronous" AsyncRendering="true">
                <LocalReport ReportPath="Models\\TestReport.rdlc">

                </LocalReport>
            </rsweb:ReportViewer>
        </ContentTemplate>
    </asp:UpdatePanel>

    </form>
</body>
</html>

And Codebehind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Microsoft.Reporting.WebForms;

namespace SSRSMVC.Views.Home
{
    public partial class Report : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                string test = Request.Params["val1"];

                ReportViewer.LocalReport.DataSources.Add(new ReportDataSource("DataSet1", new SSRSMVC.Models.DataProvider().GetData()));
            }
        }
    }
}

And lastly my View page,

<script type="text/javascript">
    $(window).load(function () {
        $.post('/Report.aspx', { val1: "Hello World" }, function (data) {
            var rv_frame = document.getElementById('Frame1');
            rv_frame = (rv_frame.contentWindow) ? rv_frame.contentWindow : (rv_frame.contentDocument.document) ? rv_frame.contentDocument.document : rv_frame.contentDocument;

            rv_frame.document.open();
            rv_frame.document.write(data);
            rv_frame.document.close();
        });
    });
</script>

Phil Phil · Accepted Answer · 2010-05-25T08:42:09

The solution appears to be to use a form element to post and then populate the iframe, I've also posted a Microsoft Connect bug as any Microsoft AJAX inside an iframe causes the JavaScript error "sys is undefined", I tried 1 script manager and 1 update panel and got the same error.

Workaround code,

<div id="HiddenFormTarget" style="display:none;"></div>

<iframe frameborder="0" id="Frame1" name="Frame1" style="width: 100%;height: 400px; overflow: hidden;">
</iframe>

<script type="text/javascript">
    function ProcessReport() {
        var form = $('<form method="post" target="Frame1" action="/Report.aspx"></form>');
        form.append('<input type="hidden" id="val1" name="val1" value="Hello World!!!" />');

        $("#HiddenFormTarget").append(form);

        form.submit();

        $("#HiddenFormTarget").empty();
    }

    $(window).load(function () {
        ProcessReport();
    });

    $("H2").click(function () { ProcessReport(); });
</script>

http://connect.microsoft.com/VisualStudio/feedback/details/561066/reportviewer-2010-iframe-internet-explorer

SSRS ReportViewer 2010 Iframe IE Problem

1 Answers