This is a migrated thread and some comments may be shown as answers.

RadWindow with NavigateUrl Scrollbar Disappearing in Chrome

0 Answers 160 Views
Window
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Telerik Admin
Top achievements
Rank 1
Iron
Telerik Admin asked on 04 Jul 2016, 12:44 PM

Problem: The scrollbars of RadWindow with NavigateUrl is lost in Chrome browser when the visibility of the window is toggled.

Details: The issue stems from a bug in Chrome browser ( Iframe scrollbars disappear when toggling visibility of the iframe element) that is related to scrollbars disappearing of an iframe element when its display attribute is set to "none" and then "". The issue can be seen in this video (http://screencast.com/t/KoBPnfk4ZcMK) and can be reproduced with no Telerik UI for ASP.NET AJAX controls:

HtmlPage.html:
        <script>
            function showIframe() {
                document.getElementById("iframe1").style.display = "";
            }
            function hideIframe() {
                document.getElementById("iframe1").style.display = "none";
            }
        </script>
        <input type="button" name="name" value="Show Iframe" onclick="showIframe(); return false;" />
        <input type="button" name="name" value="Hide Iframe" onclick="hideIframe(); return false;" />
        <iframe id="iframe1" src="HtmlPage2.html"></iframe>
HtmlPage2.html:
<body>
    <div style="border: 1px solid green; height: 1200px;">
    </div>
</body>


Solution
: You can choose either approach:

  • Set the ReloadOnShow property of the RadWindow to true.
  • Or use the following workaround to reset the iframe element dimensions:
function clientShow(sender, args) {
    if ($telerik.isChrome) {
        sender.get_contentFrame().style.width = "";
        setTimeout(function () {
            sender.get_contentFrame().style.width = "100%";
        }, 0);
    }
}
<telerik:RadWindow ID="RadWindow1" runat="server" NavigateUrl="HtmlPage2.html" OnClientShow="clientShow"></telerik:RadWindow>

 

Tags
Window
Asked by
Telerik Admin
Top achievements
Rank 1
Iron
Share this question
or