roncli.com blog: Reporting Services ReportViewer in browsers other than IE

So I've been working with SQL Reporting Services at work lately, and was annoyed with how slow it was in Internet Explorer. I tried running other browsers, but it just never rendered right. Well, after an hour or two of research, I finally came up with a method to get these browsers to render correctly.

The syndrome that many users experience is that the table becomes squished, as if the table of results wants to be as thin as possible. The reason for this is because someone at Microsoft in all of their brilliance decided to put the results table inside a cell of another table, and in that same row they added a 2nd cell with 0 height (WTF?) and 100% width (WTF!). The 100% width squishes everything in the first cell to as little width as possible.

JavaScript to the rescue:

    <script type="text/javascript">
        function addLoadEvent(func) {
            var oldonload = window.onload;
            if (typeof window.onload != 'function') {
                window.onload = func;
            } else {
                window.onload = function() {
                    if (oldonload) {
                        oldonload();
                    }
                    func();
                }
            }
        }

        function checkEmptyCells() {
            var all = document.getElementById("<%=rvReport.ClientID%>").all ? document.getElementById("<%=rvReport.ClientID%>").all : document.getElementById("<%=rvReport.ClientID%>").getElementsByTagName('*');
            for (var i = 0; i < all.length; i++) {
                if (all[i].tagName == "TD" && all[i].width == "100%" && all[i].height == "0" && all[i].innerHTML == "") {
                    all[i].width = "1px";
                }
            }
        }

        addLoadEvent(checkEmptyCells);
    </script>

The first function is simply a function that updates the window.onload event, so that even if you already have an onload event you don't have to mess with that code.

The second function checks for the offending empty TD, and reduces its width to 1 pixel. Change rvReport to whatever the ID of your ReportViewer control is. Take that, empty cell!

Finally, we call the addLoadEvent with our handy checkEmptyCells function. What will happen is the browser will wait until everything is loaded and then execute the script.

If the checkEmptyCells function looks familiar, it should... I borrowed this from my own code. Remember me getting rid of the red X's on OSMusic.Net? I used the checkImages function for that. The code is very similar, but instead of checking for unloaded images and hiding them, we're checking for bloated empty cells and thinning them.

Leave it to Microsoft to figure out how to screw up nested tables. Leave it to JavaScript to be able to provide a quick, easy fix.

Labels: Coding, JavaScript, OSMusic.Net, SQL Reporting Services

0 Comments

Post a Comment