Report Viewer is to small in some browsers

2 posts, 0 answers
  1. Sergio
    Sergio avatar
    1 posts
    Member since:
    Jun 2009

    Posted 25 Sep 2018 Link to this post

    Hi Support,

    This problem happens in the Server Report Viewer and also in our application from the upgrade to the Telerik Report 2018.

    Look de style generate height: 25.5px . !!!


    <div class="trv-report-page" style="height: 25.5px; width: 1146px;">


    Example:
    Image attach

     

    Thank You

    Sérgio

  2. Veronika
    Admin
    Veronika avatar
    15 posts

    Posted 26 Sep 2018 Link to this post

    Hello Sérgio,

    This is a known issue related with some style that came from Telerik Report Viewer. The fix will be available with the next Internal Build.

    If you can not wait till then, I can give you a temporary workaround.

    Open Preview.cshtml, located in Views/Report folder. In the <style> tag add the following code:

    /* ----------- iPad Pro ----------- */
    /* Portrait and Landscape */
    @@media only screen
      and (min-device-width: 1024px)
      and (max-device-width: 1366px)
      and (-webkit-min-device-pixel-ratio: 1.5) {
        .sheet {
            overflow: unset;
        }
    }

    Next, in the onDocumentReady function, add the code bellow, immediately after viewer = $("#reportViewer1").data("telerik_ReportViewer");

    viewer.bind(telerikReportViewer.Events.PAGE_READY, function (e, arguments) {
     
        if (window.matchMedia('(min-device-width: 1024px)').matches &&
            window.matchMedia('(max-device-width: 1366px)').matches &&
            window.matchMedia('(-webkit-min-device-pixel-ratio: 1.5)').matches) {
     
            var sheetDomEl = $("#reportViewer1").find(".sheet"),
                styles = sheetDomEl.attr("style"),
                height = sheetDomEl.get(0).style.height;
            styles = styles.replace(height, height + " !important")
     
            $("#reportViewer1").find(".sheet").css('cssText', styles);
            $("#reportViewer1").find(".trv-report-page").attr('style', 'height: auto');
        }
     
         
        viewer.unbind(telerikReportViewer.Events.PAGE_READY);
    });

    This should reset the styles that come from the Report Viewer. Let us know if you have other questions.


    Regards,
    Veronika
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top