Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1570
WebDropDown Container Display Issue
posted

I'm having an issue with the way that the list item container is displaying after you've scrolled the page. I've seen a couple posts about this issue and the result was to make sure EnableDropDownAsChild was set to false (I believe), but I have this issue regardless of whether it's true or false. I have to keep it false however, otherwise the dropdown list will just expand whatever control its inside (like a WebTab), instead of opening over the parent control.

I created a brand new website from scratch, added a webtab and two webdropdowns, one inside the webtab, one outside.

As you can see from the attached image, there is no problem with either if you haven't scrolled the page down but the second you do and try the dropdown, its container displays wrong. This was taken from IE9 but I've also tried this site in other browsers. Here's the breakdown:

IE9 After Scrolling
Inside Tab - Doesn't Work
Outside Tab - Works

 

Chrome After Scrolling
Inside Tab - Doesn't Work
Outside Tab - Doesn't Work


Firefox After Scrolling
Inside Tab - Works
Outside Tab - Works

I believe this same behavior happens in other controls other than the WebTab (such as the WebDialogWindow) but I didn't test that thoroughly.

Here is the body markup for the site.


<body>

    <form id="form1" runat="server">
    <ig:WebScriptManager ID="WebScriptManager1" runat="server">
    </ig:WebScriptManager>
    <div style="height1000pxmargin-top250px;">
        <ig:WebTab ID="WebTab1" runat="server" Width="300px" Height="200px">
            <Tabs>
                <ig:ContentTabItem runat="server" Text="Tab 1">
                    <Template>
                        <ig:WebDropDown ID="WebDropDown1" EnableDropDownAsChild="false" runat="server" Width="200px" EnableAnimations="False">
                        </ig:WebDropDown>
                    </Template>
                </ig:ContentTabItem>
                <ig:ContentTabItem runat="server" Text="Tab 2">
                </ig:ContentTabItem>
            </Tabs>
        </ig:WebTab>
        <br />
        <br />
        <br />
        <br />
        <ig:WebDropDown ID="WebDropDown2" EnableDropDownAsChild="false" runat="server" Width="200px" EnableAnimations="False">
        </ig:WebDropDown>
    </div>
    </form>
</body>
</html>

Please advise on what to do to fix this. Is it a bug? Is there something wrong in my code? Please help.

Thank you.