Why is SSRS 2012 date picker not showing the calendar in Internet Explorer and not showing at all in Chrome?

Question

I have some ASP.NET code that has an SSRS report control on page. The web application is hosted on a different server than where SSRS is hosted. The problem I'm having is when I pull up the report in Internet Explorer the date picker control is not showing the calendar and if I try to pull up the report in Chrome the date picker control doesn't show up at all. If I type dates into the text boxes, the report works just fine but, we would really like to be able to use the date picker control.

Any ideas as to what could be wrong?

I believe this question to be different from those asked before because I am not only asking about non-IE browsers, but also asking about an issue with IE.

The date picker control does not display the calendar in IE when the user clicks on the control.

Wayne E. Pfeffer

------ Edit to add code example ------

The aspx code is:

<rsweb:ReportViewer ID="ReportViewer1" runat="server" ProcessingMode="Remote" Width="100%" Height="100%" AsyncRendering="False">
</rsweb:ReportViewer>        
<asp:ScriptManager ID="ScriptManager1" runat="server">

There is a drop down list where a report is chosen and this is the code for loading the report into the report viewer:

    protected void loadViewer(string report) {
        ReportViewer1.ProcessingMode = ProcessingMode.Remote;
        IReportServerCredentials irsc = new CustomReportCredentials(
            ConfigurationManager.AppSettings["ReportUser"],
            ConfigurationManager.AppSettings["ReportPswd"],
            ConfigurationManager.AppSettings["ReportDomain"]);

        ReportViewer1.ServerReport.ReportServerCredentials = irsc;
        ReportViewer1.ServerReport.ReportServerUrl = new Uri(ConfigurationManager.AppSettings["ReportURL"]);
        ReportViewer1.ServerReport.ReportPath = ConfigurationManager.AppSettings["ReportPath"] + report;
        ReportViewer1.SizeToReportContent = true;

        //Get the list of account IDs that the user has viewothertransactions at
        List<string> vaIds = new List<string>();
        string votAccts = (String)Session["votAccounts"];
        string[] aIds = votAccts.Split(',');
        foreach (var aId in aIds)
        {
            vaIds.Add(aId);
        }

        //Create the list of account ids where the user can only see its orders
        List<DropdownOption> acclist = (List<DropdownOption>)Session["searchAccounts"];
        string acctIds = "";
        if (null != acclist)
        {
            for (int i = 0; i < acclist.Count; i++)
            {
                if (!vaIds.Contains(acclist[i].Id))
                {
                    acctIds += acclist[i].Id + ",";
                }
            }
            if (acctIds.Length > 0)
            {
                acctIds = acctIds.Substring(0, acctIds.Length - 1);
            }

        }

        Users user = (Users) Session["userObject"];
        ReportParameter userid = new ReportParameter("Userid", user.Id.ToString());
        ReportParameter votAccounts = new ReportParameter("VotAccounts", votAccts);
        ReportParameter accounts = new ReportParameter("Accounts", acctIds);                
        log.Debug("Requesting report '" + report + "'. Parameters - Userid=" + user.Id + " VotAccounts=" + votAccts +  " Accounts=" + acctIds);

        ReportViewer1.ServerReport.SetParameters(new ReportParameter[] { userid, votAccounts, accounts });
        ReportViewer1.ServerReport.Refresh();
    }

Answer 1

When using Internet Explorer 11 you could try Compatibility Mode . Try pressing F12 whilst on the page to see what browser emulation is used.

Answer 2

I recently encountered this problem on IE and tracked down the issue to a javascript function registered by the report control. The javascript function adds a prototype method "Show" to the "DropDownParamClass". Inside the function is a line of code that checks for the presence of a "FORM" tag and if it's not there abandons the function...

// do not show the drop down if the frame has not yet been aded to the form tag
    if (floatingIFrame.parentNode.tagName.toUpperCase() != "FORM")
        return;

In my case the floatingIFrame.parentNode.tagName was returning a "DIV"... As a fix I've simply overwritten the DropDownParamClass.prototype.Show function with a slightly revised version (not the new explaining variable "readyToShowCalendar" which checks for either a DIV or a FROM tag), see below...

    <script language="javascript" type="text/javascript">

        if (typeof (window.DropDownParamClass) !== "undefined") {
            //Fix for bug in report viewer control resulting in the Calendar Control not displaying when the calendar icon is clicked.
            window.DropDownParamClass.prototype.Show = function () {
                var floatingIFrame = document.getElementById(this.m_floatingIframeID);

                // do not show the drop down if the frame has not yet been added to the form tag
                var readyToShowCalendar = "FORM,DIV".indexOf(floatingIFrame.parentNode.tagName.toUpperCase()) > -1;
                if (!readyToShowCalendar) return;


                // position the drop down. This must be done before calling show base. Otherwise, 
                // a scroll bar is likely to appear as a result of showBase which would make the 
                // position invalid.
                var newDropDownPosition = this.GetDropDownPosition();
                floatingIFrame.style.left = newDropDownPosition.Left + "px";
                floatingIFrame.style.top = newDropDownPosition.Top + "px";

                this.ShowBase();

                // poll for changes in screen position
                this.StartPolling();
            };

        }

  </script>

This script was then simply placed just underneath the initial tag on the page. After this the calendar control then seems to open as expected when clicking the calendar icon.