Fixing SSRS Report Viewer control date picker in Google chrome

SSRS Report Viewer control works well in IE6+ but has some known compatibility issues with other major browsers(Firefox, Chrome etc.) around date picker and print button.

For more information read this

http://msdn.microsoft.com/en-us/library/ms251673.aspx

I am presenting a simple solution to fix date picker issue in Chrome with  a combination of some server side code and Client side JQuery script.

 

Server Side Code

 

1) Add the below code in the page/control file in which the reportviewer control resides

 <asp:HiddenField ID="DatePickers" runat="server" />

 

2) Add the below code in the code behind file of page/control in which the reportviewer control resides(.Net 2.0 version)


protected override void OnPreRender(EventArgs e)
{
  base.OnPreRender(e);
  DatePickers.Value = string.Join(",",(new List(GetDateParameters()).ToArray()));
}
private IEnumerable GetDateParameters()
{
  // I'm assuming report view control id as reportViewer
  foreach (ReportParameterInfo info in reportViewer.ServerReport.GetParameters())
  {
    if (info.DataType == ParameterDataType.DateTime)
    {
        yield return string.Format("[{0}]",info.Prompt);
    }
  }
}

 

Client Side Code

 

1) Add the below script in the html head section


$(document).ready(function(){

 if ($.browser.webkit)
 {
    $($(":hidden[id*='DatePickers']").val().split(",")).each(function(i, item){
         var h = $("table[id*='ParametersGrid'] span").filter(function(i) {
             var v = "[" + $(this).text() + "]";
             return (v != null && v.indexOf(item) >= 0);
          }).parent("td").next("td").find("input").datepicker({
           showOn: "button"
           ,buttonImage: '/Reserved.ReportViewerWebControl.axd?OpType=Resource&Name=Microsoft.Reporting.WebForms.calendar.gif'
           ,buttonImageOnly: true
           ,dateFormat: 'dd/mm/yy'
           ,changeMonth: true
           ,changeYear: true
           });
     });
  }

});

 

Hope this helps!!! Smile