Missing icon of the DateTime parameter editor in the HTML5 ASP.NET WebForms ReportViewer
Environment
| Product | Progress® Telerik® Reporting HTML5 Web Forms Report Viewer | up to R1 2017 |
Description
Missing icon of the DateTime parameter editor in the HTML5 ASP.NET WebForms ReportViewer.
In the browser's console (F12 Developer Tools) you will see an error related to loading http://<host>/BlueOpal/sprite.png. The sprite is related to Telerik Kendo UI CSS used by the HTML5 Viewer.
Solution
Replace the HTML5 ASP.NET WebForms ReportViewer with the HTML5 Javascript Viewer. It is the same viewer, where settings will have to be applied in JavaScript instead of C#|VB.NET.
Load the correct Telerik Kendo UI CSS and JS files before creating the HTML5 ASP.NET WebForms ReportViewer. For example, in the <head> element of the page with the viewer load the CSS and JS files required by the viewer:
<head>
<title>Telerik HTML5 Report Viewer Demo</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<link href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.common.min.css" rel="stylesheet" id="common-css" />
<link href="http://kendo.cdn.telerik.com/2015.3.930/styles/kendo.blueopal.min.css" rel="stylesheet" id="skin-css" />
<!--kendo.all.min.js can be used as well kendo.web.min.js and kendo.mobile.min.js-->
<script src="/ReportViewer/js/kendo.subset.2015.3.930.min.js"></script>
...
</head>
This will load the styles before the viewer requests the default resources from the Reporting REST service. For more details, check HTML5 ASP.NET WebForms ReportViewer: Styling and Appearance.